ng-repeat: tek alana göre filtrele

Ben ng-repeat kullanarak tekrar ediyorum bir dizi ürün var ve kullanıyorum

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

Bu ürünleri renge göre filtrelemek için. Filtre çalışıyor ancak ürün adı / açıklaması vb. Renk içeriyorsa, filtre uygulandıktan sonra ürün kalır.

Filtreyi her alan yerine dizimin renk alanına uygulanacak şekilde nasıl ayarlarım?

Filtre sayfasındaki örneğe bakın . Bir nesne kullanın ve color özelliğinde rengi ayarlayın:

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

colourFiltrenin uygulanmasını istediğiniz özelliği (yani ) belirtin :

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

Üzerinde filtrelemeniz gereken nesnelerle eşleşen bir özelliğe sahip bir nesneye göre filtre uygulayabilirsiniz:

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'un önerdiği gibi, bu elbette değişken tarafından aktarılabilir.

Belirli bir nesnenin torununa (veya daha derinine) filtre uygulamak istiyorsanız, nesne hiyerarşinizi oluşturmaya devam edebilirsiniz. Örneğin, 'thing.properties.title' öğesine filtre uygulamak istiyorsanız, aşağıdakileri yapabilirsiniz:

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

Ayrıca, bir nesneyi birden çok özelliğine filtre nesnesine ekleyerek de filtreleyebilirsiniz:

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

Bunu yapmanın en iyi yolu bir işlev kullanmaktır:

html

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

javaScript

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

Alternatif olarak, öğeleri belirli bir ölçütlere göre dinamik olarak göstermek ve gizlemek için ngHide veya ngShow'u kullanabilirsiniz.

Açısal filtreye dikkat edin. Alanda belirli bir değer seçmek istiyorsanız, filtre kullanamazsınız.

Misal:

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

Bu her ikisini de seçecektir, çünkü substr
Bu, "color" (renk) "blue" (mavi) değil, "color" (renk) "string" (mavi) içeren bir ürün seçmek istediğiniz anlamına gelir.

Renge göre ara:

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

iç yuva da yapabilirsiniz.

filter:{prop1:{innerprop1:searchinput}}

Aşağıdakileri yapacaksanız:

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

... sadece itemTypeId 2 ve itemStatus 1 öğelerini almakla kalmaz, aynı zamanda itemType 20, 22, 202, 123 ve itemStatus 10, 11, 101, 123 öğelerini de alırsınız. Bunun nedeni filtre: {.. sözdizimi bir dize sorgusu içerir gibi çalışır.

Ancak ,: true koşulunu ekleyecekseniz, tam eşlemeye göre filtre yapar:

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

benim yolum bu

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 bir Giriş alanıdır ya da ne istersen

Bu şekilde görüntüleniyor

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

Sen kullanmalıdır filter:{color_name:by_colour}yerine

filter:by_colour

Bir nesnenin tek bir özelliğiyle eşleştirmek istiyorsanız, nesne yerine bu özelliği yazın, aksi takdirde diğer bazı özellikler eşleşir.

Filtre uygulamak istediğiniz nesnenin filtredeki özelliğini belirtin:

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

Ancak filtreyi yalnızca ad üzerine uygulamak istiyorsunuz

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

Bir alan için filtre istiyorsanız:

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

Tüm alan için filtre istiyorsanız:

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

ve https://docs.angularjs.org/api/ng/filter/filter sizin için iyi