ng-repeat: фильтр по одному полю

Укажите свойство (т.е. colour), в которое вы хотите применить фильтр:

<div ng-repeat="product in products | filter:{ colour: by_colour }">

Вы можете фильтровать объект с свойством, соответствующим объектам, которые вы должны фильтровать на нем:

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

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

Это, конечно, может быть передано переменной, как предположил Марк Райкок.

Если вы хотите отфильтровать внука (или глубже) данного объекта, вы можете продолжать строить свою иерархию объектов. Например, если вы хотите отфильтровать "thing.properties.title", вы можете сделать следующее:

<div ng-repeat="thing in things | filter: { properties: { title: title_filter } }">

Вы также можете фильтровать несколько свойств объекта, просто добавив их в свой объект фильтра:

<div ng-repeat="thing in things | filter: { properties: { title: title_filter, id: id_filter } }">

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

HTML

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

Javascript

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

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

Будьте осторожны с фильтром angular. Если вы хотите выбрать определенное значение в поле, вы не можете использовать фильтр.

Пример:

Javascript

app.controller('FooCtrl', function($scope) {
   $scope.products = [
       { id: 1, name: 'test', color: 'lightblue' },
       { id: 2, name: 'bob', color: 'blue' }
       /*... etc... */
   ];
});

HTML

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

Это выберет оба, потому что используйте что-то вроде substr
Это означает, что вы хотите выбрать продукт, где "цвет" содержит строку "синий", а не где "цвет" - "синий".

Если вы должны были сделать следующее:

<li class="active-item" ng-repeat="item in mc.pageData.items | filter: { itemTypeId: 2, itemStatus: 1 } | orderBy : 'listIndex'"
                id="{{item.id}}">
    <span class="item-title">{{preference.itemTitle}}</span>
</li>

... вы не только получите предметы itemTypeId 2 и itemStatus 1, но также получите предметы с элементами Item 20, 22, 202, 123 и itemStatus 10, 11, 101, 123. Это связано с тем, что фильтр: Синтаксис {...} работает как строка, содержащая запрос.

Однако, если вы должны добавить условие: true, он будет фильтровать с помощью точного соответствия:

<li class="active-item" ng-repeat="item in mc.pageData.items | filter: { itemTypeId: 2, itemStatus: 1 } : true | orderBy : 'listIndex'"
                id="{{item.id}}">
    <span class="item-title">{{preference.itemTitle}}</span>
</li>

Поиск по цвету:

     <input type="text" ng-model="searchinput">

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

вы также можете сделать внутреннее гнездо.

Фильтр: {prop1: {innerprop1: searchinput}}

Мой путь - это

subjcts is

[{"id":"1","title":"GFATM"},{"id":"2","title":"Court Case"},{"id":"3","title":"Renewal\/Validity"},{"id":"4","title":"Change of Details"},{"id":"5","title":"Student Query"},{"id":"6","title":"Complains"}]

sub - поле ввода или любое другое, что вам нравится

Отображается следующим образом

<div ng-if="x.id === sub" ng-repeat=" x in subjcts">{{x.title}}</div>

Вы должны использовать   filter:{color_name:by_colour} вместо

filter:by_colour

Если вы хотите совместить с одним свойством объекта, тогда напишите это свойство вместо объекта, иначе какое-либо другое свойство получит совпадение.