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?
The ng-repeat values can be filtered according to the ng-model in AngularJS by using the value of the input field as an expression in a filter. We can set the ng-model directive on an input field to filter ng-repeat values.
You can consider using transclusion inside a custom directive, to achieve the behavior you are looking for without using ng-repeat.
Note: The $index variable is used to get the Index of the Row created by ng-repeat directive. Each row of the HTML Table consists of a Button which has been assigned ng-click directive. The $index variable is passed as parameter to the GetRowIndex function.
Answer: A is the correct option. The syntax of applying multiple filters in AngularJS can be written as: {{ expression | filter1 | filter2 | ... }}
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>
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>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With