How to filter ng-repeat with values NOT IN another array in Angular?
Question
Is there any way to use an Angular filter to compare value with every value from an array?
Categories: <span ng-repeat="c in i.categories | filter: '!'+'myArray' ">{{c}}</span>
I would like to display values from i.categories that are not in myArray :
$scope.i = {
categories: [
"Europe & Eurasia",
"Featured",
"Headlines",
"Middle East",
"News",
"NEWS BY TOPIC",
"News Categories",
"REGIONAL NEWS"
]
};
$scope.myArray = ['Featured', 'Headlines', 'News'];
I want to get everything from c which is not contained in the myArray .
I've tried with writing some functions, but I get my app really slow, because of a lot requests.
So, can I just somehow pass my array, and let Angular goes through every single item in that array and compare it with the current value?
2 answers
solution1
4 ACCPTED 2017-02-20 12:59:07
You can try to use a custom filter, like the following:
angular.module('myApp', []).filter('notInArray', function($filter) {
return function(list, arrayFilter) {
if(arrayFilter) {
return $filter("filter")(list, function(listItem) {
return arrayFilter.indexOf(listItem) == -1;
});
}
};
});
Use it like this:
<div ng-repeat='c in i.categories | notInArray:myArray'>{{c}}</div>
JSFiddle demo
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>
solution2
1 2017-02-20 11:33:46
You can use like this also.
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>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.