У меня есть фильтр в Firestore filterByDepartamentos
Я использую mat-select, фильтр хорошо работает с опциями, которые у меня есть.
Теперь я хочу включить первую опцию в mat-selectчтобы вернуться в исходное состояние, это я могу сделать с помощью кнопки с (click) ="ngOnInit()"
, но как я могу сделать это с первым параметром в mat -select?
Есть ли способ достичь этого?
service.ts
getEventosAll() {
this.eventos = this.afs.collection('eventos', ref => ref
.where('fechaTermino', '>=', this.today)
.orderBy('fechaTermino', 'asc')
).snapshotChanges().pipe(
map(actions => actions.map(a => {
const data = a.payload.doc.data() as Evento;
const id = a.payload.doc.id;
return { id, ...data };
}))
);
return this.eventos;
}
filterByDepartamentos(departamento) {
const byDepartamentos = this.afs.collection('eventos', ref => ref
.where('departamento', '==', departamento)
).valueChanges();
return byDepartamentos;
}
component.ts
ngOnInit() {
this.eventos = this.fs.getEventosAll();
}
filtrarDepartamento(departamento) {
this.selectedDepartamento = departamento;
this.eventos = this.fs.filterByDepartamentos(departamento);
}
component.html
<mat-form-field appearance="outline" class="col-6">
<mat-label>Departamento</mat-label>
<mat-select [(ngModel)]="selectedDepartamento" (ngModelChange)="filtrarDepartamento(selectedDepartamento)">
<mat-option [ngValue]="null">Todos</mat-option>
<mat-option *ngFor="let departamento of departamentos | async" [value]="departamento.nombre"> {{ departamento.nombre }}
</mat-option>
</mat-select>
</mat-form-field>