ng-repeat: filtra por campo único

Tengo una variedad de productos que repito usando ng-repeat y estoy usando

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

para filtrar estos productos por color. El filtro funciona, pero si el nombre / descripción del producto, etc. contiene el color, el producto permanece después de aplicar el filtro.

¿Cómo configuro el filtro para que solo se aplique al campo de color de mi matriz en lugar de a todos los campos?

Vea el ejemplo en la página de filtro . Use un objeto y establezca el color en la propiedad de color:

Search by color: <input type="text" ng-model="search.color">
<div ng-repeat="product in products | filter:search"> 

Especifique la propiedad (es decir colour) donde desea que se aplique el filtro:

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

Puede filtrar por un objeto con una propiedad que coincida con los objetos que tiene que filtrar:

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' }"> 

Por supuesto, esto se puede pasar por variable, como sugirió Mark Rajcok.

Si desea filtrar en un nieto (o más profundo) del objeto dado, puede continuar construyendo su jerarquía de objetos. Por ejemplo, si desea filtrar en 'thing.properties.title', puede hacer lo siguiente:

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

También puede filtrar múltiples propiedades de un objeto simplemente agregándolas a su objeto de filtro:

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

La mejor manera de hacer esto es usar una función:

html

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

javascript

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

Alternativamente, puede usar ngHide o ngShow para mostrar y ocultar dinámicamente elementos según un determinado criterio.

Tenga cuidado con el filtro angular. Si desea seleccionar un valor específico en el campo, no puede usar filtro.

Ejemplo:

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' }"> 

Esto seleccionará ambos, porque usar algo como substr
Eso significa que desea seleccionar un producto donde "color" contiene cadena "azul" y no donde "color" es "azul".

Búsqueda por color:

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

También puedes hacer un nido interior.

filter:{prop1:{innerprop1:searchinput}}

Si hicieras lo siguiente:

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

... no solo obtendría elementos de itemTypeId 2 y itemStatus 1, sino que también obtendría elementos con itemType 20, 22, 202, 123 y itemStatus 10, 11, 101, 123. Esto se debe a que el filtro: {.. .} la sintaxis funciona como una cadena contiene consulta.

Sin embargo, si agregara la condición : verdadero , filtraría por coincidencia exacta:

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

mi camino es este

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 es un campo de entrada o lo que quieras

Mostrando así

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

Debe usar en filter:{color_name:by_colour}lugar de

filter:by_colour

Si desea hacer coincidir con una sola propiedad de un objeto, escriba esa propiedad en lugar del objeto, de lo contrario, alguna otra propiedad obtendrá coincidencia.

Especifique la propiedad en filtro, del objeto en el que desea aplicar filtro:

//Suppose Object
var users = [{
  "firstname": "XYZ",
  "lastname": "ABC",
  "Address": "HOUSE NO-1, Example Street, Example Town"
},
{
  "firstname": "QWE",
  "lastname": "YUIKJH",
  "Address": "HOUSE NO-11, Example Street1, Example Town1"
}]

Pero desea aplicar el filtro solo en el nombre

<input type = "text" ng-model = "first_name_model"/>
<div ng-repeat="user in users| filter:{ firstname: first_name_model}">

Si desea filtrar por un campo:

label>Any: <input ng-model="search.color"></label> <br>
<tr ng-repeat="friendObj in friends | filter:search:strict">

Si desea filtrar para todos los campos:

 label>Any: <input ng-model="search.$"></label> <br>
 <tr ng-repeat="friendObj in friends | filter:search:strict">

y https://docs.angularjs.org/api/ng/filter/filter bueno para ti