AngularJS özel filtre işlevi

Question

Denetleyicimin içinde, bir dizi nesneyi filtrelemek istiyorum. Bu nesnelerin her biri,

listelerinin yanı sıra dizeleri içerebilen bir haritadır. $filter('filter')(array, function) biçimini kullanmayı denedim ancak işlevimin içindeki dizinin tek tek öğelerine nasıl erişeceğimi bilmiyorum. İstediğimi göstermek için bir pasaj.

$filter('filter')(array, function() { 
    return criteriaMatch(item, criteria); 
}); 

Sonra criteriaMatch() yılında, ben bireysel mülkiyetin her

var criteriaMatch = function(item, criteria) { 
    // go thro each individual property in the item and criteria 
    // and check if they are equal 
} 

ben denetleyicisi tüm bu yapmak ve listelerin bir listesini derlemek ve bunları zorunda eşleşirse kontrol edecek kapsamı. Bu yüzden sadece $filter('filter') numarasına erişmem gerekiyor. Şimdiye kadar ağda bulduğum tüm örnekler, işlevin içinde statik kriterler arar, bir kriter nesnesini geçmezler ve dizideki her bir öğeye karşı test ederler.

Answer 1

Böyle kullanabilirsiniz: http://plnkr.co/edit/vtNjEgmpItqxX5fdwtPi?p=preview

Bulduğunuz gibi, filter diziden kalem kalem kabul yüklem işlevi kabul eder. Yani, sadece verilen criteria dayalı bir yüklem işlevi oluşturmanız gerekir.

Bu örnekte, criteriaMatch, belirtilen criteria ile eşleşen bir işlevini döndüren bir işlevdir.

şablonu:

<div ng-repeat="item in items | filter:criteriaMatch(criteria)"> 
    {{ item }} 
</div> 

kapsamı: Eğer denetleyici filtreyi kullanmak aynı şekilde isterseniz

$scope.criteriaMatch = function(criteria) { 
    return function(item) { 
    return item.name === criteria.name; 
    }; 
}; 

Answer 2

Ayrıca, buradan yapın:

<div ng-repeat="item in items | filter:criteriaMatch(criteria)"> 
    {{ item }} 
</div> 

Sen gibi bir şey yapabilir:

var filteredItems = $scope.$eval('items | filter:filter:criteriaMatch(criteria)'); 

Answer 3

AngularJS JavaScript'inizde (bir HTML öğesinden ziyade) filter'u nasıl kullandığınıza ilişkin bir örnek.

Bu örnekte, her biri bir ad ve 3 karakterli bir ISO kodu içeren bir Ülke kaydı dizisine sahibiz.

Belirli bir 3 karakterli kodla eşleşen bir kayıt için bu listede arama yapacak bir işlev yazmak istiyoruz. İşte

bizfilter kullanmadan bunu yaparım nasıl: Bunda yanlış

$scope.FindCountryByCode = function (CountryCode) { 
    // Search through an array of Country records for one containing a particular 3-character country-code. 
    // Returns either a record, or NULL, if the country couldn't be found. 
    for (var i = 0; i < $scope.CountryList.length; i++) { 
     if ($scope.CountryList[i].IsoAlpha3 == CountryCode) { 
      return $scope.CountryList[i]; 
     }; 
    }; 
    return null; 
}; 

Evet, hiçbir şey. Burada

Ancak aynı işlevi filter kullanarak nasıl görüneceğini var:

$scope.FindCountryByCode = function (CountryCode) { 
    // Search through an array of Country records for one containing a particular 3-character country-code. 
    // Returns either a record, or NULL, if the country couldn't be found. 

    var matches = $scope.CountryList.filter(function (el) { return el.IsoAlpha3 == CountryCode; }) 

    // If 'filter' didn't find any matching records, its result will be an array of 0 records. 
    if (matches.length == 0) 
     return null; 

    // Otherwise, it should've found just one matching record 
    return matches[0]; 
}; 

Çok kıvrımlara.

filter, sonuçta bir dizi (eşleşen kayıtların listesi) döndürdüğünü unutmayın, bu nedenle, bu örnekte, 1 kayıt veya NULL döndürmek isteriz.

Bu yardımcı olur umarım.