将搜索过滤器添加到Angular-6数据表

Question

我试图在我的Angular数据表的顶部添加一个搜索过滤器（我现在不太在意它的位置）。我正在使用Angular-6-datatable（https://www.npmjs.com/package/angular-6-datatable）和引导程序。我在这里创建了一个stackblitz项目。

https://stackblitz.com/edit/angular-utd8cc

我只想能够搜索“名称”列。请协助。

Answer 1

只需为过滤的数据添加一个单独的数组，然后将表绑定到该数组即可：

ts文件

search(term: string) {
    if(!term) {
      this.filterData = this.data;
    } else {
      this.filterData = this.data.filter(x => 
         x.name.trim().toLowerCase().includes(term.trim().toLowerCase())
      );
    }
  }

html

<input type="text" (keyup)='search($event.target.value)'>