Angular.js ng-repeat过滤属性具有多个值之一(值的OR)

Question

是否可以过滤对象数组,以便属性值可以是几个值(OR条件),而无需编写自定义过滤器

这类似于这个问题 - Angular.js ng-repeat:按单个字段过滤

而不是

<div ng-repeat="product in products | filter: { color: 'red' }">

有可能做这样的事情

<div ng-repeat="product in products | filter: { color: 'red'||'blue' }">

如下样本数据─

$scope.products = [
   { id: 1, name: 'test', color: 'red' },
   { id: 2, name: 'bob', color: 'blue' }
   /*... etc... */
];

我没试过

<div ng-repeat="product in products | filter: { color: ('red'||'blue') }">

Answer 1

最好的方法是使用一个函数:

<div ng-repeat="product in products | filter: myFilter">

$scope.myFilter = function (item) { 
    return item === 'red' || item === 'blue'; 
};

或者,您可以使用ngHide或ngShow根据特定条件动态显示和隐藏元素.

Answer 2

对我来说,它的工作原理如下.

<div ng-repeat="product in products | filter: { color: 'red'} | filter: { color:'blue' }">

Answer 3

我的"ng-if"应该有效:

<div ng-repeat="product in products" ng-if="product.color === 'red' 
|| product.color === 'blue'">

Answer 4

在HTML中:

<div ng-repeat="product in products | filter: colorFilter">

在Angular中:

$scope.colorFilter = function (item) { 
  if (item.color === 'red' || item.color === 'blue') {
  return item;
 }
};

Answer 5

这是一种在传递额外参数时执行此操作的方法:

/sf/answers/1246965821/(感谢Denis Pshenov)

<div ng-repeat="group in groups">
    <li ng-repeat="friend in friends | filter:weDontLike(group.enemy.name)">
        <span>{{friend.name}}</span>
    <li>
</div>

随后端:

$scope.weDontLike = function(name) {
    return function(friend) {
        return friend.name != name;
    }
}

.

而另一种方法是仅使用模板内过滤器:

/sf/answers/876966541/(感谢mikel)

<div ng:app>
  <div ng-controller="HelloCntl">
    <ul>
       <li ng-repeat="friend in friends | filter:{name:'!Adam'}">
            <span>{{friend.name}}</span>
            <span>{{friend.phone}}</span>
        </li>
    </ul>
</div>