Question

我正在使用AngularJS过滤葡萄酒列表的结果。葡萄酒按颜色（红色，白色，玫瑰色，香槟色）和其他参数分类。

如果使用复选框（例如红色）选中一种颜色，则会显示已过滤的红葡萄酒列表。但是当选择两种颜色时，不会显示任何结果（例如红色和白色）。

我的意愿：

即使检查了红色，白色和香槟色，也会显示（红色，白色和香槟酒或其他参数）的列表。我的主要愿望是能够选择多个参数，并显示所有已检查的参数。能够检查颜色，国家..

这里是代码示例：

<div ng-controller="MainCtrl">

<input ng-model="characteristics.red" type="checkbox" >red</input>
<input ng-model="characteristics.white" type="checkbox" >white</input>
<input ng-model="characteristics.rose" type="checkbox" >rose</input>
<input ng-model="characteristics.champagne" type="checkbox" >champagne</input>
    <br><br>

<div ng-repeat="wine in filtered= (wines |filteredstoves:characteristics) |       filteredstoves:characteristics">

    {{wine.name}} - {{wine.characteristics}}
        </div>
    <br><br>
     Filtered list has {{filtered.length}} items
</div>

演示代码： http://jsfiddle.net/stefanos/kTYdd/26/

的问候，

斯特凡

Answer 1

尝试更新您的过滤器：

.filter('filteredstoves', function() {
  return function(stoves, characteristics) {
    var result = []; 
    angular.forEach(characteristics, function(value, key) {
      if(value) {
        for(var index = 0; index < stoves.length; index++) {
          var wine = stoves[index];
          if(wine.characteristics.indexOf(key) >= 0) {
            if (result.indexOf(wine) === -1){
                result.push(wine);
            }
          }
        }
      }
    });
    return result;
  }
});

DEMO

AngularJS：如何从许多复选框中显示许多结果

1 个答案: