Este es mi compiente en el cual se un popover para abrir una inetrfaz y poder elegir opciones usando ion-select, la idea es que cuando se selecione una opcion liste los registros depemdiemdo del campo seleccionado
Popover.component.html
<ion-header>
<ion-item color="primary">
<ion-label>Filtar por:</ion-label>
<ion-button (click)='Cancel()'>
Cerrar
</ion-button>
</ion-item>
</ion-header>
<ion-content padding>
<ion-list>
<ion-item>
<ion-label color="danger"
position="floating">Nombre/Código</ion-label>
<ion-select interface="popover">
<ion-select-option value="NameAsc">Name-Asc</ion-select-option>
<ion-select-option value="NameDesc">Name-Desc</ion-select-option>
<ion-select-option value="CodeAsc">Code-Asc</ion-select-option>
<ion-select-option value="CodeDesc">Code-Desc</ion-select-option>
</ion-select>
</ion-item>
</ion-list>
<ion-button shape="round" size="small" expand="full"
(click)='applyFilters()'>Aplicar Filtros</ion-button>
</ion-content>
Este es el componete del popover que es lanzado en la interfaz de proyectos, cno la finalidad de poder filtar la opciones y que se recargue la pagina
popover.componet.ts
import { Component, OnInit } from '@angular/core';
import { PopoverController } from '@ionic/angular';
import { NavController } from '@ionic/angular';
import { ModalController } from '@ionic/angular';
@Component({
selector: 'app-popover',
templateUrl: './popover.component.html',
styleUrls: ['./popover.component.scss']
})
export class PopoverComponent implements OnInit {
public FilterBy: any;
public projects: Array<any>;
public item: any;
constructor(
public popoverController: PopoverController,
public nav: NavController,
public modalController: ModalController
) { }
ngOnInit() {
}
Cancel() {
this.popoverController.dismiss();
console.log('Close Popover');
}
applyFilters(value) {
console.log(this.FilterBy);
this.popoverController.dismiss();
}
}