使用按钮进行ng-click过滤和不过滤

时间:2014-08-27 04:08:44

标签: angularjs

你好我有几个想要过滤数据的按钮,但是当我再次点击按钮时我无法弄清楚如何使它不成熟。我使用正常的过滤表达式,如:

<tr ng-repeat='ledata in datas  |  filter:thecondition'></tr>

根据点击的按钮,条件可能会有所不同,按钮的代码如下

ng-click="thecondition = {type: 1}"

我怎样才能用ng-class标记它?使按钮看起来按下?感谢。

2 个答案:

答案 0 :(得分:1)

要切换过滤器,请尝试以下操作:

ng-click="thecondition = thecondition ? '' : {type: 1}"

如果三元运算符有值,则将thecondition设置为空字符串,如果为空,则将其设置为类型为1的对象。

要使用ng-class设置类,请尝试:

ng-class="{depressed_button: thecondition}"

thecondition真实时,将应用类depression_button。您可以在样式表或其他地方定义depression_button类。

答案 1 :(得分:1)

我的建议是尝试实施自己的自定义过滤器。

接近的地方:

自定义过滤器

angular.module('myApp', []).filter('myFilter', function() {
  return function(items, param1, param2) {
    return items.filter(function(item){ /* your custom conditions */ });
  };
});

并在 html

 <li ng-repeat="item in items | myFilter:'car': 2">

当然,您可以扩展并执行更适合您的应用需求的操作。

我推荐自定义过滤器的原因是因为它可以让您更好地与视图和业务逻辑分离;这与角度背后的MVVM设计模式更加一致。