Basically, how can i clean a ionic select with a button? I’ve try doing this.escolhido = null but get me this error:
“ERROR Error: Query: First argument passed to startAt(), endAt(), or equalTo() cannot be an object.”
I understand the error and why its happening but how can i fix it? Here is my codes:
admin.html
<ion-header>
<ion-navbar color="amarelo">
<ion-buttons left>
<button ion-button icon-only menuToggle>
<ion-icon name="menu"></ion-icon>
</button>
</ion-buttons>
<ion-title >
Administrador
</ion-title>
</ion-navbar>
</ion-header>
<ion-content padding>
<ion-grid>
<ion-row>
<ion-label>Categorias</ion-label>
<ion-select (ionChange)="onContextChange($event)" [(ngModel)]="escolhido"
cancelText="Cancelar" okText="Ok">
<ion-option *ngFor="let gene of genesList$ | async"
detail-push>{{gene.nome}}</ion-option>
</ion-select>
<button ion-button (click)="limpaFiltro()" color="amarelo">
Limpar
</button>
</ion-row>
<ion-row>
<ion-list>
<ion-list-header class="estilo">
Producoes
</ion-list-header>
<ng-container *ngFor="let prod of prodsList$ | async | slice:0:show; let i=index">
<ion-item
detail-push navPush="ViewProdPage"[navParams]="{prod:prod}">
{{prod.titulo}}
</ion-item>
</ng-container>
</ion-list>
</ion-row>
<ion-row>
<button full ion-button (click)="loadMore()" color="amarelo">
Carregar mais
</button>
</ion-row>
</ion-grid>
</ion-content>
<ion-footer>
<ion-fab bottom right>
<button color="amarelo" ion-fab navPush="AddProdPage"><ion-icon name="add"></ion-icon></button>
</ion-fab>
</ion-footer>
admin.ts
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { Producao } from '../../models/producao';
import { Observable } from 'rxjs';
import { map } from 'rxjs/operators';
import { ProducoesProvider } from '../../providers/producoes/producoes'
import { Genero } from '../../models/genero';
/**
* Generated class for the AdminPage page.
*
* See https://ionicframework.com/docs/components/#navigation for more info on
* Ionic pages and navigation.
*/
@IonicPage()
@Component({
selector: 'page-admin',
templateUrl: 'admin.html',
})
export class AdminPage {
public show: number;
escolhido: Object;
prodsList$: Observable<Producao[]>;
genesList$: Observable<Genero[]>;
constructor(public navCtrl: NavController, public navParams: NavParams,
private producoesProvider: ProducoesProvider) {
this.show = 5;
this.prodsList$ = this.producoesProvider.getProdsList().valueChanges();
}
ionViewWillLoad(){
this.genesList$ = this.producoesProvider.getGenesList().valueChanges();
}
limpaFiltro(){
this.escolhido = null;
}
loadMore() {
this.show += 5;
}
onContextChange(ctxt: string): void {
this.prodsList$ = this.producoesProvider.assembleGeneroFilteredList(ctxt).valueChanges();
}
}