Javascript 过滤器输入选择组合firestore

我有这两个Firestore过滤器，每个过滤器工作良好，但相互独立。我的问题是，有没有办法把它们结合起来

也就是说，例如，如果我根据

Categoría

选择一个过滤器，我尊重我在

Departmento

中选择的过滤器

服务.ts

filterByDepartamentos(departamento) {
  const byDepartamentos = this.afs.collection('eventos', ref => ref
  .where('departamento', '==', departamento)
  ).valueChanges();
  return byDepartamentos;
}

filterByCategorias(categoria) {
  const byCategorias = this.afs.collection('eventos', ref => ref
  .where('categoria', '==', categoria)
  ).valueChanges();

  return byCategorias;
}

filtrarCategoria(categoria) {
  this.selectedCategoria = categoria;
  this.eventos = this.fs.filterByCategorias(categoria);
}

filtrarDepartamento(departamento) {
  this.selectedDepartamento = departamento;
  this.eventos = this.fs.filterByDepartamentos(departamento);
}

组件。ts

filterByDepartamentos(departamento) {
  const byDepartamentos = this.afs.collection('eventos', ref => ref
  .where('departamento', '==', departamento)
  ).valueChanges();
  return byDepartamentos;
}

filterByCategorias(categoria) {
  const byCategorias = this.afs.collection('eventos', ref => ref
  .where('categoria', '==', categoria)
  ).valueChanges();

  return byCategorias;
}

filtrarCategoria(categoria) {
  this.selectedCategoria = categoria;
  this.eventos = this.fs.filterByCategorias(categoria);
}

filtrarDepartamento(departamento) {
  this.selectedDepartamento = departamento;
  this.eventos = this.fs.filterByDepartamentos(departamento);
}

component.html

<div class="row">

  <mat-form-field appearance="outline" class="col-6">
    <mat-label>Departamento</mat-label>
    <mat-select [(ngModel)]="selectedDepartamento" (ngModelChange)="filtrarDepartamento(selectedDepartamento)">
      <mat-option *ngFor="let departamento of departamentos | async" [value]="departamento.nombre"> {{ departamento.nombre }}
      </mat-option>
    </mat-select>
    </mat-form-field>

  <mat-form-field appearance="outline" class="col-6">
    <mat-label>Categoría</mat-label>
    <mat-select [(ngModel)]="selectedCategoria" (ngModelChange)="filtrarCategoria(selectedCategoria)">
      <mat-option *ngFor="let categoria of categorias | async" [value]="categoria.nombre"> {{ categoria.nombre }}
       </mat-option>
      </mat-select>
     </mat-form-field>

   </div>

部门
{{部门名称}
类别
{{categoria.nombre}}