AngularJS：如何显示来自许多复选框的许多结果

【问题标题】：AngularJS: how to display many results from many checkboxesAngularJS：如何显示来自许多复选框的许多结果
【发布时间】：2023-05-07 05:27:01
【问题描述】：

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

当使用复选框选中一种颜色（例如红色）时，会出现经过过滤的红酒列表。但选择两种颜色时，不会出现任何结果（例如，红色和白色）。

我的愿望：

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

这里是代码示例：



red
white
rose
champagne
    





    {{wine.name}} - {{wine.characteristics}}
        
    


     Filtered list has {{filtered.length}} items

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

问候，

史蒂芬

【解决方案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

【讨论】：

感谢您的快速回复！我刚试过，效果很好！！我尝试了几个小时，我没有成功......非常感谢Khanh TO！
感谢您的帮助.....可以过滤结果。我添加了更多，如果它检查了“红色”和“leger”，则出现所有带有红色和leger的条目，它没有被过滤。如果我检查香槟和莱格，同样的事情。 jsfiddle.net/stefanos/RUFdy/4
@Stéphane：有什么问题？没看懂
我的英语不太好。我的愿望是，例如：如果红色复选框和 leger 都被选中，将显示一个列表，其中仅包含带有 leger 参数的条目 red wines，而不是包含 too leger 或 red 的其他条目。听起来很难建立一个代码来过滤所有这些参数。问候
@Stéphane：对不起，但我还是不明白你的意思。您能否将其作为一个单独的问题提出，以便您也能引起其他人的更多关注？在那个问题中，你可以给出例子，上下文，......以使其更清楚。这就是你应该在 SO meta.stackoverflow.com/questions/254814/… 上做的事情

分享于2023年05月08日 angular-ngmodel angularjs checkbox filter 问答