基于下拉列表的Angular过滤表

Question

我正在尝试根据我的下拉列表传递的数据来过滤表格。

我在下拉菜单中使用了reactForm：

<form novalidate [formGroup]="policeform">
  <p-dropdown [options]="Assureurs" optionLabel="nom"  formControlName="assureur"></p-dropdown>
  <p-dropdown [options]="Intermediares" optionLabel="nom"  formControlName="intermediare"></p-dropdown>

我称后端为'Assureurs'和'Interemediares'列表：

 getAssureurs(){
      this.policeService.getAssureursList().subscribe(
        data => {
        this.Assureurs=data;
        },
       error =>
        console.log(error));
    }
    getIntermediares(){
      this.policeService.getIntermediaresList().subscribe(
        data => {
        this.Intermediares=data;
        },
       error =>
        console.log(error));
    }

    initPoliceForm(){
      this.policeform = this.fb.group({
        assureur:[''],
        intermediare:['']
    });
    }

我的'Assureur'就像：（例如）

{
        "id":3,
        "nom": "Atla",
        "dateCreation":"2020-05-14T00:20:15.956+0000",
        "Actif":true
    }

这是我的过滤器：

@Pipe({
  name: 'tableFilter'
})
export class TableFilterPipe implements PipeTransform {

  transform(list: any[], formControls: Object) {
    const keys       = Object.keys(formControls).filter(key => formControls[key]);
    const filterUser = user => keys.every(key => {
      user[key].nom==formControls[key].nom;
     });
    return keys.length ? list.filter(filterUser) : list;
  }
}

但是它没有用，它没有返回过滤的数据！

这是我使用过滤器的方式：

<tr  *ngFor="let police of polices |async| orderBy: 'id' | tableFilter: policeform.value ">

Answer 1

您可以添加component.ts文件：