使用管道过滤器，使其在多种条件下工作

Question

我有一个管道过滤器，它按 name 过滤我的客户列表。我需要添加另一个过滤器，所以客户端可以通过 account_number 过滤管道：

import {Pipe, PipeTransform} from '@angular/core';

@Pipe({
  name: 'filter',
  pure: false
})

export class FilterPipe implements PipeTransform {

  transform(items: any[], term): any {
    return term ? items.filter(item => item.name.toLowerCase().indexOf(term.toLowerCase()) != -1) : items;
  }

}

在我看来，我是这样绑定过滤器的：

<input type="text" class="form-control" placeholder="Name" name="term" [(ngModel)]="term">
<input type="number" class="form-control" placeholder="Account number"> <!--Here I want to make another ngModel-->

<table>
  <tr *ngFor="let client of clients | filter: term | sortBy: 'id'; let i = index"
    <td>{{client.name}}</td>
    <td>{{client.account_number}}</td>
  </tr>
</table>

那么，我是否需要制作另一个 pipe 以通过不同的属性进行过滤，还是可以在一个 pipe 中完成？另外，如果它是两个不同的管道，我应该如何将它包含在视图中的过滤器中？谢谢。

Answer 1

你可以用单管来做试试这个

 transform(values: any[], filter: string): any {
    if (!values || !values.length) return [];
    if (!filter) return values;

    filter = filter.toUpperCase();

    if (filter && Array.isArray(values)) {
      const keys = Object.keys(values[0]);
      return values.filter(v => v && keys.some(k => v[k].toUpperCase().indexOf(filter) >= 0));
    }
  }

使用管道过滤器，使其在多种条件下工作

Using a pipe filter, to make it work on several conditions

filter

pipes-filters

angular