angularjs - 过滤器如何在 AngularJS 中工作？

Question

我有一个用 ng-repeat 生成的表(来自对象的数组)。

我想用搜索文本字段过滤它。

我的数组中包含的对象具有深层属性。

我不知道为什么以及如何，但过滤器仅适用于电子邮件字段，该字段与其他属性一样深。

我正在使用这个搜索表单:

<input type="text" name="search" ng-model="searchText" />
...
<tr ng-repeat="x in obj | filter:searchText track by $index">
  ...
</tr>

plunker

编辑:

This answer帮助我理解为什么它不起作用。
有人知道我如何绕过过滤器中的 $ 验证吗？

我使用 $ 是因为我遵循 Google Contact API 格式。

Answer 1

email有效，因为嵌套属性 address不包含任何 $字符。

不幸的是，我认为没有办法绕过这种行为，但是您可以制作自己的过滤器并在 ng-repeat 中使用它。 .

这是一个适合您的简单示例:

JS

app.filter('customFilter', function() {
  return function(items, keyword) {
    if (!keyword || keyword.length === 0) return items;

    return items.filter(function(item){
      var phrase = keyword.$.toLowerCase();
      return item.gd$name.gd$fullName.$t.toLowerCase().includes(phrase) || 
        item.gd$name.gd$familyName.$t.toLowerCase().includes(phrase) || 
        item.gd$name.gd$givenName.$t.toLowerCase().includes(phrase) ||
        item.gd$email[0].address.toLowerCase().includes(phrase) ||
        item.gd$phoneNumber[0].$t.toLowerCase().includes(phrase) ||
        (!!item.gd$organization[0].gd$orgTitle && item.gd$organization[0].gd$orgTitle.$t.toLowerCase().includes(phrase)) ||
        (!!item.gd$organization[0].gd$orgName && item.gd$organization[0].gd$orgName.$t.toLowerCase().includes(phrase));
    });
  }
});

HTML

<tr ng-repeat="x in obj | customFilter:searchText">

当然，您必须为可能的 null 添加更多检查。值(value)观。我只是想让它适用于您提供的数据。

希望，你会发现它很有用。

这里是 plunk