如何动态地禁用NG重复内的过滤器 [英] How to dynamically disable a filter inside ng-repeat

问题描述

这是可以使用复选框去除过滤器？

如果复选框被选中，NG-重复内过滤器将被禁用。例如，如果复选框 countryfilter 和 winetypefilter 检查，相关的过滤器将被禁用。

原来的code（启用过滤器）

 ＆LT;李NG重复=葡萄酒在葡萄酒| winetypefilter：winetypes | countryfilter：countrytypes | stylefilter：styletypes＆GT;
                {{wine.name}}是从{{wine.type}}与{{wine.style}}风格{{wine.country}}
＆LT; /李＆GT;
 

（与复选框禁用过滤器， countryfilter 和 winetypefilter ）
会导致：

 ＆LT;李NG重复=酒中酒| stylefilter：styletypes＆GT;
            {{wine.name}}是从{{wine.type}}与{{wine.style}}风格{{wine.country}}
＆LT; /李＆GT;
 

解决方案

当然，你可以启用动态禁用过滤器...可以有很多方法可以做到这浮现在我的脑海里只是发送第三个参数作为简单的解决方案一个布尔检查过滤器启用或不...

下面是过滤器的样品...

  app.filter（'winetypefilter'，函数（）{
  返回功能（输入，过滤器，isEnable）{
    //如果isEnable然后筛选出的葡萄酒
    如果（isEnable）{
      VAR的结果= [];
      angular.forEach（输入功能（酒）{
          angular.forEach（过滤器，功能（isfiltered，类型）{
              如果（isfiltered＆安培;＆放大器;类型=== wine.type）{
                  result.push（酒）;
              }
          }）;
      }）;
      返回结果;
    }
    //否则就是不任何过滤只是发送输入而不改变
    其他{
      返回输入
    }
  };
}）;
 

和这里是 PLUNKER ...

It is possible to remove filter using a checkbox?

If checkboxes are checked, filters inside ng-repeat would be disabled. For example, if the checkboxes countryfilter and winetypefilter are checked, the related filters would be disabled.

Original code (filters enabled)

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

(filters disabled with the checkboxes, countryfilter and winetypefilter ) Would result:

<li ng-repeat="wine in wines | stylefilter:styletypes">
            {{wine.name}} is a {{wine.type}} with {{wine.style}} style from {{wine.country}}
</li>

解决方案

of course you can enable disable your filter dynamically... there can be many ways to do it simplest solution that comes to my mind is just sending third parameters as a boolean to check if filter is enable or not...

here is filter sample...

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

and here is PLUNKER...

这篇关于如何动态地禁用NG重复内的过滤器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！