[英]How to set filter for ng-repeat inside another ng-repeat with Angular.js
[英]How to filter ng-repeat with values NOT IN another array in Angular?
有什么方法可以使用角度过滤器将值与数组中的每个值进行比较?
Categories: <span ng-repeat="c in i.categories | filter: '!'+'myArray' ">{{c}}</span>
我想显示i.categories
中不在myArray
:
$scope.i = {
categories: [
"Europe & Eurasia",
"Featured",
"Headlines",
"Middle East",
"News",
"NEWS BY TOPIC",
"News Categories",
"REGIONAL NEWS"
]
};
$scope.myArray = ['Featured', 'Headlines', 'News'];
我想从c
中获取myArray
未包含的所有内容。
我已经尝试编写一些函数,但是由于有很多请求,我的应用程序真的很慢。
因此,我可以以某种方式传递我的数组,然后让Angular遍历该数组中的每个项目并将其与当前值进行比较吗?
您可以尝试使用自定义过滤器,如下所示:
angular.module('myApp', []).filter('notInArray', function($filter) {
return function(list, arrayFilter) {
if(arrayFilter) {
return $filter("filter")(list, function(listItem) {
return arrayFilter.indexOf(listItem) == -1;
});
}
};
});
像这样使用它:
<div ng-repeat='c in i.categories | notInArray:myArray'>{{c}}</div>
angular.module('Test', []).filter('notInArray', function($filter) { return function(list, arrayFilter) { if(arrayFilter) { return $filter("filter")(list, function(listItem) { return arrayFilter.indexOf(listItem) == -1; }); } }; }); function Ctrl($scope) { $scope.i = {categories: [ "Europe & Eurasia", "Featured", "Headlines", "Middle East", "News", "NEWS BY TOPIC", "News Categories", "REGIONAL NEWS" ]}; $scope.myArray = ['Featured', 'Headlines', 'News']; }
<!DOCTYPE html> <html ng-app='Test'> <head> <script src="http://code.angularjs.org/1.1.1/angular.min.js"></script> <meta charset=utf-8 /> </head> <body ng-controller='Ctrl'> <div ng-repeat='c in i.categories | notInArray:myArray'>{{c}}</div> </body> </html>
您也可以这样使用。
angular.module('App.filters', []).filter('companyFilter', [function () {
return function (arr, selArr) {
var retArr = [];
angular.forEach(arr, function(v, k){
var found =0;
for(var i=0; i<selArr.length; i++){
if(selArr[i] == v.name){
found = 1;
break;
}
}
if(found == 0){
retArr.push(v);
}
})
return retArr;
};
}]);
<div ng-controller="MyCtrl">
<div ng-repeat="c in categories|filter:customFilter">
{{c}}
</div>
</div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.