1

我正在使用 AngularJS 过滤酒单的结果。葡萄酒按颜色(红色、白色、玫瑰色、香槟色)和其他参数进行分类。

当使用复选框选中一种颜色(例如红色)时,会出现经过过滤的红酒列表。But when two colors are selected, no results appears (red and white for example).

我的愿望:

  • 即使选中了红色、白色和香槟色,也会出现(红色、白色和香槟酒或其他参数)的列表。我的主要愿望是能够选择多个参数,并显示所有选中的参数。能够检查颜色,国家..

这里的代码示例:

<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/

问候,

斯蒂芬妮

4

1 回答 1

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;
  }
});

演示

于 2014-06-08T02:08:20.657 回答