我正在尝试过滤我的JSON文件中的结果,以便用户可以点击女士或男士风格,但有些产品同时具有女士和男士风格,那么我怎样才能显示'两者的结果'没有三个勾选框?我知道我的JSON中不能有重复的名称,但是现在只是作为一个例子。任何帮助,将不胜感激。我把我的代码放在这里:
http://plnkr.co/edit/fXOZHqo48ntvsdJA875y?p=preview
<div ng-controller="myCtrl">
<div ng-repeat="(prop, ignoredValue) in { 'category': true, 'cut': true }" ng-init="filter[prop]={}">
<b>{{prop | capitalizeFirst}}:</b><br />
<span class="quarter" ng-repeat="opt in getOptionsFor(prop)">
<b><input type="checkbox" ng-model="filter[prop][opt]" /> {{opt}}</b>
</span>
<hr />
</div>
<div ng-repeat="w in filtered=(products | filter:filterByProperties)">
{{w.name}} ({{w.category}})
</div>
<hr />
Number of results: {{filtered.length}}
</div>
答案 0 :(得分:1)
您需要在json中进行一些更改。
cut
有一个值,那么它就是string
&amp;只要有多个值,您就可以维持array
比如"cut": "ladies"
,"cut": "mens",
&amp; "cut": ["ladies","mens"]
filterByProperties
函数<强>标记强>
<span ng-show="!isArray(opt)" class="quarter" ng-repeat="opt in getOptionsFor(prop)">
<b><input type="checkbox" ng-model="filter[prop][opt]" /> {{opt}}</b>
</span>
<强>代码强>
$scope.isArray = function(val) {
return angular.isArray(val)
}
$scope.filterByProperties = function(product) {
// Use this snippet for matching with AND
var matchesAND = true;
for (var prop in $scope.filter) {
if (noSubFilter($scope.filter[prop])) continue;
if (!$scope.isArray(product[prop])) { //if its not an array
if (!$scope.filter[prop][product[prop]]) {
matchesAND = false;
break;
}
} else {
//if its an array
for (var i = 0; i < product[prop].length; i++) {
var anyPropMatch = false;
if ($scope.filter[prop][product[prop][i]]) {
anyPropMatch = true;
break;
}
}
if (!anyPropMatch) {
matchesAND = false;
break;
}
}
}
return matchesAND;
};