Angular6：过滤与属性匹配的列表元素答案

【问题标题】：Angular6: Filter a list elements that match a propertyAngular6：过滤与属性匹配的列表元素
【发布时间】：2018-09-21 00:02:24
【问题描述】：

我想通过仅显示具有特定 groupId 的 items 来过滤我的角度表的 dataSource > 属性。

component.html

 <mat-table [dataSource]="groupSource |  filter : currentGroupId"></mat-table>

filter.pipe.ts

import { Pipe, PipeTransform } from '@angular/core';
@Pipe({
  name: 'filter'
})
// return items of a group
export class FilterPipe implements PipeTransform {

  transform(group: any[], currentGroupId: number): any[] { 

    return group.filter( item=> item.groupId = currentGroupId);

    }
}

但是，我收到此错误：

错误类型错误：group.filter 不是函数
在 FilterPipe.push../src/app/filter.pipe.ts.FilterPipe.transform (filter.pipe.ts:9)
在 checkAndUpdatePureExpressionInline (core.js:9949)
在 checkAndUpdateNodeInline (core.js:10518)
在 checkAndUpdateNode (core.js:10476)
在 debugCheckAndUpdateNode (core.js:11109)
在 debugCheckDirectivesFn (core.js:11069)
在 Object.eval [as updateDirectives] (BasketComponent.html:144)
在 Object.debugUpdateDirectives [as updateDirectives] (core.js:11061)
在 checkAndUpdateView (core.js:10458)
在 callViewAction (core.js:10699)

我做错了什么？

【问题讨论】：

标签： angular list filter pipe

【解决方案1】：

问题在于相等性检查。应该是

 return group.filter( item=> item.groupId === currentGroupId);

【讨论】：

【解决方案2】：

当您提供的数据源可能是不是数组的 MatTableDataSource 实例时，您正在尝试对数组使用过滤器方法。事实上，MatTableDataSource 有一个 filter 属性，它应该是一个字符串。

但是，您将需要使用 MatTableDataSource 的 filterPredicate 函数。

Read the documentation for the correct way to filter a Material data source.

【讨论】：