AngularJS自定义filterfunction

在我的控制器里面,我想过滤一个对象数组。 这些对象中的每一个都是可以包含string以及列表的映射

我尝试使用$filter('filter')(array, function)格式,但我不知道如何访问我的函数内的数组的个别元素。 这是一个片段,显示我想要的。

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

然后在criteriaMatch() ,我将检查每个属性是否匹配

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

我必须在控制器中完成所有这些工作,并编制一个列表清单,并将其设置在范围内。 所以我确实需要以这种方式访问$filter('filter') 。 到目前为止,我在networking中find的所有示例都在函数内部都有静态标准search,它们不会传递一个标准对象并针对数组中的每个项目进行testing。

你可以像这样使用它: http : //plnkr.co/edit/vtNjEgmpItqxX5fdwtPi?p=preview

就像你发现的那样, filter接受谓词函数,从数组中逐个接受谓词函数。 所以,你只需要根据给定的criteria创build一个谓词函数。

在这个例子中, criteriaMatch是一个函数,它返回一个符合给定criteria的谓词函数。

模板:

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

范围:

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

下面是一个如何在AngularJS JavaScript(而不是HTML元素)中使用filter的例子。

在这个例子中,我们有一个国家logging数组,每个logging包含一个名称和一个3个字符的ISO代码。

我们要编写一个函数,它将通过这个列表search与特定的三字符代码匹配的logging。

以下是我们如何做, 而不使用filter

 $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; }; 

是的,没有错。

但是下面是使用filter的相同函数的外观:

 $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]; }; 

很整洁。

请记住, filter返回一个数组作为结果(匹配logging的列表),所以在这个例子中,我们要么返回1个logging,要么返回NULL。

希望这可以帮助。

另外,如果您想在控制器中使用filter,则与您在此处执行的操作相同:

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

你可以做这样的事情:

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