如何从Angular Material Table中的select中精确匹配过滤器字符串数据?

问题描述

我正在尝试按生产或应用程序名称过滤表。我已使用本指南https://www.freakyjolly.com/angular-material-table-custom-filter-using-select-box/作为我的方法,除了生产或应用程序具有相同字符串的一部分完全相同的部分之外,其他所有部分都工作正常。

例如,如果我在过滤器中选择“第二个应用程序”,则应该仅向我显示具有“第二个应用程序”的行,而不是向我显示名称中带有“应用程序”的每一行。

我不知道如何编辑此过滤器逻辑以完全匹配select中的字符串

// Custom filter method fot Angular Material Datatable
  createFilter() {
    let filterFunction = function (data: any,filter: string): boolean {
      let searchTerms = JSON.parse(filter);
      let isFilterSet = false;
      for (const col in searchTerms) {
        if (searchTerms[col].toString() !== '') {
          isFilterSet = true;
        } else {
          delete searchTerms[col];
        }
      }
      
      let nameSearch = () => {
        let found = false;
        if (isFilterSet) {
          for (const col in searchTerms) {
            searchTerms[col].trim().toLowerCase().split(' ').forEach(word => {
              if (data[col].toString().toLowerCase().indexOf(word) != -1 && isFilterSet) {
                found = true
              }
            });
          }
          return found
        } else {
          return true;
        }
      };
      return nameSearch()
    };
    return filterFunction
  }

解决方法

我认为我设法做到这一点,并且可以按我的意愿工作。我只是按列完全过滤:

filterValues = {
 prodName: '',appName: ''
};

然后我写了这个过滤器:

  columnFilter(): (data: any,filter: string) => boolean {
    let filterFunction = function(data,filter): boolean{
      let searchTerms = JSON.parse(filter);
      return data.prodName.toLowerCase().indexOf(searchTerms.prodName) !== -1
      && data.appName.toLowerCase().indexOf(searchTerms.appName) !== -1;
    };
    return filterFunction;
  }