Angularjs 过滤一个字段的两个值

Question

我需要使用一个或另一个过滤器，怎么办？

<tr ng-repeat="currentCollectionItem in binding 
               | filter: ({ isPending: false } || {isPending: undefined})">

Answer 1

最好的办法是在 controller/component class 上定义一个过滤方法，然后改用它。

这有两个主要优点：

更容易进行单元测试 - 您可以直接在 controller/component 实例上调用函数来测试过滤器逻辑。
更简单markup/keeps复杂的代码，在JS中。

如果您在这方面需要帮助，请告诉我。

Answer 2

使用自定义谓词函数：

<tr ng-repeat="currentCollectionItem in binding | filter: notPendingFilterFn">

$scope.notPendingFilterFn = function(value, index, array) {
     return value.isPending === false || value.isPending === undefined;
};

谓词函数可用于编写任意过滤器。为数组的每个元素调用该函数，将元素、它的索引和整个数组本身作为参数。

有关详细信息，请参阅

AngularJS filter Filter API Reference

Answer 3

解决方案

您只能使用一个条件来执行此操作：

filter:'!true'

这是应用假属性和未定义属性的方法。

例子

<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Example - example-filter-filter-production</title>
  <script src="//code.angularjs.org/snapshot/angular.min.js"></script>
</head>
<body ng-app="">
<div ng-init="binding = [{name:'John', isPending:false},
                         {name:'Mary', isPending:false},
                         {name:'Mike', isPending:undefined},
                         {name:'Adam'},
                         {name:'Julie', isPending:true},
                         {name:'Juliette', isPending:true}]"></div>

<table id="searchTextResults">
  <tr><th>Name</th><th>isPending</th></tr>
  <tr ng-repeat="currentCollectionItem in binding | filter:'!true'">
    <td>{{ currentCollectionItem.name }}</td>
    <td ng-show="{{currentCollectionItem.isPending !== undefined}}">{{ currentCollectionItem.isPending }}</td>
    <td ng-show="{{currentCollectionItem.isPending === undefined}}">undefined</td>
  </tr>
</table>
</body>
</html>

Angularjs 过滤一个字段的两个值

Angularjs filter on two values of one field

angularjs

filter

angularjs-filter

解决方案

例子