Angular.js ng-repeat фильтр по свойству, имеющему одно из нескольких значений (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') }">

Ответ 1

Лучший способ сделать это - использовать функцию:

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

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

В качестве альтернативы вы можете использовать ngHide или ngShow для динамического отображения и скрытия элементов на основе определенных критериев.

Ответ 2

Для меня это работало как указано ниже.

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

Ответ 3

В HTML:

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

В Angular:

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

Ответ 4

Мне нужно "ng-if":

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

Ответ 5

Вот как это сделать, передавая дополнительный аргумент:

fooobar.com/questions/59249/... (спасибо Денису Пшенову)

<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;
    }
}

И еще один способ только с фильтром в шаблоне:

fooobar.com/questions/59249/... (спасибо 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>

Ответ 6

Я нашел более общее решение с самым angular -ным решением, которое я могу думать. В принципе, вы можете передать свой собственный компаратор функции по умолчанию filterFilter. Здесь plunker.