Angular 选择时mat表的过滤数据更改mat select（级联过滤）

我有一个mat表，它当前过滤输入数据。 我有一个垫子选择，只有两个选项：活动和非活动

//mat select的html代码，其中status1有2个值：active和inactive

  <div style="width: 100%;">
  <div fxLayout="row" fxLayoutAlign="end center" style="padding: 15px 15px 
   0px 15px;">
   <mat-form-field>
    <mat-select placeholder="Select Status" 
    (selectionChange)="onselect($event)">
        <mat-option *ngFor="let item of status1" [value]="item.display"> 
   {{item.display}}</mat-option>

    </mat-select>
   </mat-form-field>
  </div>
 </div>

   // ts code
  status1: Status[] = [
  { value: '0', display: 'Active' },
  { value: '1', display: 'Inactive' }
  ];


 onselect(item: any) {
  this.accounts = this.jsonCustomerList.Accounts;
   this.dataSource.filter = item.trim().toLowerCase();
  }

  // object

     [ 
       {"AccountName": "range1",
      "State": "",
        "Zip": "",
        "Country": "",
        "IsDeleted": false},
          {"AccountName": "local1",
          "State": "",
        "Zip": "",
        "Country": "",
        "IsDeleted": true}
        ]

{{item.display}
//ts代码
状态1：状态[]=[
{值：“0”，显示：“活动”}，
{value:'1'，display:'Inactive'}
];
onselect（项目：任何）{
this.accounts=this.jsonCustomerList.accounts；
this.dataSource.filter=item.trim（）.toLowerCase（）；
}
//反对
[ 
{“AccountName”：“range1”，
“国家”：“，
“Zip”：“，
“国家”：“，
“IsDeleted”：false}，
{“AccountName”：“local1”，
“国家”：“，
“Zip”：“，
“国家”：“，
“IsDeleted”：true}
]

若我选择active，mat table应仅显示IsDeleted:true的记录。反之亦然，对于不活动的记录，即IsDeleted:false

---

应为ts代码。

您需要重写

filterPredicate

，并像往常一样使用它，

filterPredicate

需要在过滤器通过时返回true，而在过滤器未通过时返回false

ngOnInit(){
   /* configure filter */
   this.dataSource.filterPredicate =
  (data: any, filter: string) => {
   if ('active'.includes(filter.toLowerCase())) {
      return data.IsDeleted;
    } else if ('inactive'.includes(filter.toLowerCase())) {
      return !data.IsDeleted;
    } else {
      if(data.AccountName.includes(filter.toLowerCase())){
        return true;
      }else{
        return false;
      }
    }
}

现在，您可以轻松筛选数据源：

 onselect(item: any) {
     this.accounts = this.jsonCustomerList.Accounts;
     this.dataSource.filter = item.source.value.trim().toLowerCase();  //<--- Note this line
  }

onselect（项目：任意）{
this.accounts=this.jsonCustomerList.accounts；
this.dataSource.filter=item.source.value.trim（）.toLowerCase（）//