Angular 2中一个数据表的多个过滤器

Question

我正在研究 Angular 2。在我的一个场景中，我必须为一个 DataTable 添加多个过滤器。我为我的项目创建了自定义数据表。
过滤器如：

在 google 上搜索并查看 stackoverflow 上的答案后，我发现了这个 Plunker https://plnkr.co/edit/e0PCIsqXumbXe6mAUWBI?p=preview

我有 plunker 中的代码，但不适合我。

我的代码：

管道：

transform(items: Array<any>, filter: {[key: string]: any }): Array<any> {
    return items.filter(item => {
            let notMatchingField = Object.keys(filter)
                                         .find(key => item[key] !== filter[key]);

            return !notMatchingField; // true if matches all fields
        });
}

组件HTML：

<tr *ngFor="let item of dataresult | jbgridfilter: filterItems | orderBy : [orderbyKey, 'ID']  | paginate: { itemsPerPage: numOfPages, currentPage: p }"
                      (click)="showRowDetails(item)">
                      <td *ngFor="let key of keysArray;"><span>{{item[key]}}</span></td>
                      <tr>

组件类：

valueForFilter(key, event) {
      let item = {key: event};
      this.filterItems.push(item);
    }

注意：表格是动态的，表示字段可以是任意不固定的。

Answer 1

我在这里更新了 plunker https://plnkr.co/edit/sJD1uQpkyBojzzt8nUps?p=preview

在 valueForFilter 中，filterItems 是一个对象而不是数组（至少在 plunker 示例中），因此 push 对您不起作用。

updateFilter(key,value){
  this.peopleFilter[key] = value; 
}

另外，你需要将 piple 设置为不纯

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

希望对你有帮助