如何动态禁用ng-repeat内的过滤器

Sté*_*ane 4 checkbox filter angularjs angularjs-ng-repeat

可以使用复选框删除过滤器吗?

如果选中复选框,则将禁用ng-repeat内的过滤器.例如,如果复选框countryfilterwinetypefilter被选中,相关的过滤器将被禁用.

原始代码(已启用过滤器)

<li ng-repeat="wine in wines | winetypefilter:winetypes| countryfilter:countrytypes | stylefilter:styletypes">
                {{wine.name}} is a {{wine.type}} with {{wine.style}} style from {{wine.country}}
</li>
Run Code Online (Sandbox Code Playgroud)

(过滤器与复选框,禁用countryfilterwinetypefilter会导致):

<li ng-repeat="wine in wines | stylefilter:styletypes">
            {{wine.name}} is a {{wine.type}} with {{wine.style}} style from {{wine.country}}
</li>
Run Code Online (Sandbox Code Playgroud)

Poy*_*maz 5

当然你可以启用动态禁用你的过滤器...有很多方法可以做到这一点我想到的最简单的解决方案就是发送第三个参数作为布尔值来检查过滤器是否启用...

这里是过滤器样本......

app.filter('winetypefilter', function () {
  return function(input, filter, isEnable) {
    // if isEnable then filter out wines
    if (isEnable) {
      var result = [];
      angular.forEach(input, function (wine) {
          angular.forEach(filter, function (isfiltered, type) {
              if (isfiltered && type === wine.type) {
                  result.push(wine);
              }
          });
      });
      return result;
    } 
    // otherwise just do not any filter just send input without changes
    else{
      return input
    }
  };
});
Run Code Online (Sandbox Code Playgroud)

这是PLUNKER ......