Filterpredicate 与 json 数组过滤器答案

【问题标题】：Filterpredicate with json array filterFilterpredicate 与 json 数组过滤器
【发布时间】：2020-02-18 05:48:49
【问题描述】：

我有一个非常简单的过滤器：

this.dataSource.filter = JSON.stringify({
    state: this.searchForm.controls['stateInputControl'].value,
    product: this.searchForm.controls['productInputControl'].value
});

但是，我需要添加一个过滤谓词，因为我需要一个 or 语句来表示状态。如果我只是让状态被传递，过滤谓词会很简单：

this.dataSource.filterPredicate = (data,filter:string ) => {
        return (data.state == filter || data.state == "AL")
      };

但是，过滤器不仅仅是一个字符串，它还是一个 json 数组。所以我需要做这样的事情：

this.dataSource.filterPredicate = (data,filter:{state:string,product:string} ) => {
        return ((data.state == filter.state || data.state == "AL") && data.product == filter.product)
      };

然而这会引发错误：

类型 '(data: Guide, filter: { state: string; product: string; }) => boolean' 不可分配给类型 '(data: Guide, filter: string) => boolean'。
参数“filter”和“filter”的类型不兼容。
类型 'string' 不可分配给类型 '{ state: string;产品：字符串； }'。

如何将 filterPredicate 与作为 json 数组的过滤器一起使用？

【问题讨论】：

标签： angular

【解决方案1】：

我确定了解决方案。您只需接收序列化的 JSON，然后在过滤器谓词声明中解析 JSON，如下所示：

this.dataSource.filterPredicate = (data,filter:string ) => {
        var s = JSON.Parse(filter);
        return ((data.state == s.state || data.state == "AL") && data.product == s.product)
      };

filterPredicate 还应该处理可能的空/未知/空白值，这些值可能会破坏过滤。此过滤谓词的更好格式是：

     var s = JSON.parse(filter);
      if (s.state && s.state.length && data.state !== s.state && data.state !== 'AL' && data.state !== '') { return false }
      else if (s.product && s.product.length && data.product !== s.product) { return false }
      return true;

【讨论】：