ng-repeat：単一フィールドによるフィルター

ng-repeatを使用して繰り返し使用している製品の配列があります。

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

これらの製品を色でフィルタリングします。フィルターは機能していますが、製品名/説明などに色が含まれている場合、フィルターを適用しても製品は残ります。

すべてのフィールドではなく、配列のカラーフィールドにのみ適用するようにフィルターを設定するにはどうすればよいですか？

フィルターページの例を参照してください。オブジェクトを使用して、colorプロパティで色を設定します。

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

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

Mark Rajcokが示唆したように、これはもちろん変数によって渡すことができます。

特定のオブジェクトの孫（またはより深い）でフィルタリングする場合は、オブジェクト階層を引き続き構築できます。たとえば、「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を使用して、特定の基準に基づいて要素を動的に表示および非表示にすることもできます。

角度フィルターに注意してください。フィールドで特定の値を選択する場合は、フィルターを使用できません。

例：

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
ということは、あなたは「色」は「色」が「青」である「青」ではなく文字列が含まれている製品の選択をしたいです。

色で検索：

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

あなたも内側の巣を作ることができます。

filter:{prop1:{innerprop1:searchinput}}

次のようにした場合：

<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のアイテムを取得するだけでなく、itemType 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>

私のやり方はこれです

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

オブジェクトの単一のプロパティと一致させたい場合は、オブジェクトの代わりにそのプロパティを記述します。そうでない場合、他のいくつかのプロパティが一致します。

フィルターを適用するオブジェクトのフィルターのプロパティを指定します。

//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"
}]

しかし、名だけにフィルターを適用したい

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

1つのフィールドのフィルターが必要な場合：

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

すべてのフィールドのフィルターが必要な場合：

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

と https://docs.angularjs.org/api/ng/filter/filterあなたのために良い