Dynamic filter AngularJS
HTML
<div ng-app="myApp">
<div ng-controller="myController">
<div ng-repeat="category in categories">
<h3>{{category}}</h3>
<!-- price[category] should be red, blue, yellow, depending on the category in the ng-repeat -->
<!-- price[category] should be bigger then 0 (or not zero, negative values will not occur) -->
<div ng-repeat="item in items | myFilter:category ">{{item.name}} - {{item.price[category]}}</div>
</div>
</div>
</div>
JavaScript
var myApp = angular.module('myApp', []);
myApp.controller('myController', function ($scope) {
$scope.categories = ['red', 'blue', 'yellow'];
$scope.items = [{
name: 'one',
price: {
red: 0,
blue: 187,
yellow: 3364
}
}, {
name: 'two',
price: {
red: 12,
blue: 0,
yellow: 0
}
}, {
name: 'three',
price: {
red: 15,
blue: 176,
yellow: 1939
}
}];
});
myApp.filter('myFilter', function () {
return function (items, category) {
console.log(items);
var newItems = [];
for (var i = 0; i < items.length; i++) {
if (items[i].price[category] > 0) {
newItems.push(items[i]);
}
};
return newItems;
}
});