使用管道角度搜索整个表格答案

【问题标题】：Search entire table using pipe angular使用管道角度搜索整个表格
【发布时间】：2020-02-03 17:01:20
【问题描述】：

如何从分页的整个表中搜索一个值。目前，如果第 1 页被选中，我只会从第 1 页获取搜索值。我需要的是从整个表中搜索值，无论选择哪个页面。

这是我的代码

<input [(ngModel)]="searchText" placeholder="Search..">
 <table  class="table table-striped table-hover" [mfData]="pendingReports" #mf="mfDataTable" [mfRowsOnPage]="10" >
 <thead>
 <tr>
 </tr>
 </thead>
 <tbody>
 <tr *ngFor="let data of mf.data | grdFilter: { ireportid: searchText,Property:searchText}">
 </tr>
 </tbody>
 <mfBootstrapPaginator [rowsOnPageSet]="[5,10,25]"></mfBootstrapPaginator>

过滤管：

export class GrdFilterPipe implements PipeTransform {

  transform(items: any, filter: any, defaultFilter: boolean): any {
    if (!filter){
      return items;
    }

    if (!Array.isArray(items)){
      return items;
    }

    if (filter && Array.isArray(items)) {
      let filterKeys = Object.keys(filter);

      if (defaultFilter) {
        return items.filter(item =>
            filterKeys.reduce((x, keyName) =>
                (x && new RegExp(filter[keyName], 'gi').test(item[keyName])) || filter[keyName] == "", true));
      }
      else {
        return items.filter(item => {
          return filterKeys.some((keyName) => {
            return new RegExp(filter[keyName], 'gi').test(item[keyName]) || filter[keyName] == "";
          });
        });
      }
    }
  }
}

【问题讨论】：

标签： angular angular6 pipe

【解决方案1】：

您尝试执行的操作很可能是不可能的，因为如果您使用分页，这意味着您的 UI 仅包含您尝试过滤的部分数据。因此只能为您提供部分结果。

你需要在你的服务器上实现一个过滤器功能来实现你想要的，因为你的服务器有一个“全局”的数据视图。

【讨论】：