如何过滤包含数组的 mat-table？答案

【问题标题】：How do you filter a mat-table that has an array in it?如何过滤包含数组的 mat-table？
【发布时间】：2019-08-15 19:57:20
【问题描述】：

我有一个存储在数据源中的包含 4 个显示列（email-firstname-lastname-skills）的表，其中之一是“技能”列，它是一个数组，这四列是从数据库中提取的，用户的模型是

Email [string]
firstname [string]
lastname [string]
skills 
{
 skill(id - reference to _id){
            _id: [id]
            name: [string]
          }
}

我尝试使用角度教程中的过滤器，但没有运气

我在这里尝试了这段代码


    applyFilter(filterValue: string, abc: string) {
        // this.dataSource.filter = filterValue.trim().toLowerCase();
        // console.log(this.dataSource.filter)
        const re =  { $regex: new RegExp(filterValue).source, $options:'gi' };



        this.userService.getUsers({
          '$or': [
            { firstname: re} ,
            { lastname: re },
            { email: re },
            { 'skills.skill.name': re }
            ]



        }).subscribe(users => {
          this.dataSource.data = users;
          // console.log(users)
        })
      }

我希望过滤器适用于整个表格，但代码适用于除“技能”列之外的所有列，有什么想法吗？

更新：

db structure

在该图像中有我的 mongodb 结构，有没有办法通过引用另一个数据库结构的“技能”字段自动填充“技能名称”字段？

【问题讨论】：

请提供类似 Stackblitz 的示例

标签： angular mongodb filter datasource mat-table

【解决方案1】：

最后过滤器实际上工作了，因为我保存的是 objectID 而不是字符串，所以我改变了它，一切都很好

【讨论】：

【解决方案2】：

既然你使用 observables，那就好好利用它吧：

data$ = this.userService.getUsers(...);
search = new FormControl('');
dataSource$ = combineLatest(
  this.search.valueChanges.pipe(startWith('')),
  this.data$
).pipe(
  map(([query, arr]) => arr.filter(item => item.XXX.includes(query)))
);

现在你有了一个只包含过滤结果的 Observable。您可以订阅它并从中创建数据，也可以在 HTML 中使用 async 管道。

【讨论】：