I am currently working on creating a conditional filter for a list of products. Everything was running smoothly until I made changes to the product model to support multiple categories. After this modification, the filter stopped working and an error was displayed: Broken Filter
Here is an example of the JSON structure of the product:
{
"title": "Product 2",
"designer": "Designer 1",
"id": "314",
"category": [{
"name": "Cat 5",
"name": "Cat 3",
}],
"collection": "Collection 2",
"type": "Type 2",
},
Below is the controller code for the filter:
myApp.controller('myCtrl', function ($scope, Products) {
$scope.data = Products;
$scope.filter = {};
$scope.categories = ['category','type','collection','designer'];
$scope.addProps = function(obj, array) {
if (typeof array === 'undefined') {
return false;
}
return array.reduce(function (prev, item) {
if (typeof item[obj] === 'undefined') {
return prev;
}
return prev + parseFloat(item[obj]);
}, 0);
}
$scope.getItems = function (obj, array) {
return (array || []).map(function (w) {
return w[obj];
}).filter(function (w, idx, arr) {
if (typeof w === 'undefined') {
return false;
}
return arr.indexOf(w) === idx;
});
};
// matching with AND operator
$scope.filterByPropertiesMatchingAND = function (data) {
var matchesAND = true;
for (var obj in $scope.filter) {
if( $scope.filter.hasOwnProperty(obj) ) {
if (noSubFilter($scope.filter[obj])) continue;
if (!$scope.filter[obj][data[obj]]) {
matchesAND = false;
break;
}
}
}
return matchesAND;
};
// matching with OR operator
$scope.filterByPropertiesMatchingOR = function (data) {
var matchesOR = true;
for (var obj in $scope.filter) {
if( $scope.filter.hasOwnProperty(obj) ) {
if (noSubFilter($scope.filter[obj])) continue;
if (!$scope.filter[obj][data[obj]]) {
matchesOR = false;
} else {
matchesOR = true;
break;
}
}
}
return matchesOR;
};
How can I access only the values for the categories and display unique categories? I have been attempting to get this code to work on jsfiddle for the past 2 hours without success. Here is the link to the fiddle.
EDIT
I have updated the fiddle here: http://jsfiddle.net/48qLjg2z/7/ 1. Lint the json file