выберите первую опцию вернуться фильтр Firestore - PullRequest
0 голосов
/ 04 июня 2019

У меня есть фильтр в 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>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...