ng-repeat中的angularJS过滤器表达式

时间:2014-03-24 21:55:38

标签: javascript angularjs checkbox angularjs-ng-repeat

我想知道实现它的最优雅和简单的方法是什么。 我需要为ng-repeat添加一个过滤表达式,它将从一个属性中过滤掉两个条件。

在此示例http://plnkr.co/edit/OMQxXvSjtuudMRGE4eZ8?p=preview

  • 如果输入A,则会显示A,
  • 的复选框
  • 输入B - B的显示复选框。

但我想显示指定的复选框以及任何条件为空的内容。 C没有条件,所以:

  • 如果输入A,我想显示A和C复选框,
  • 输入B,我想显示B和C复选框。

4 个答案:

答案 0 :(得分:8)

我会创建自定义过滤器,如:

app.filter('myfilter', function() {
   return function( items, condition) {
    var filtered = [];

    if(condition === undefined || condition === ''){
      return items;
    }

    angular.forEach(items, function(item) {          
       if(condition === item.condition ||  item.condition === ''){
         filtered.push(item);
       }
    });

    return filtered;
  };
});

和用法:

<span ng-repeat="charge in charges  |  myfilter:level.condition">

参见 Plunker

中的演示

它看起来非常优雅和清晰。

希望它会有所帮助

答案 1 :(得分:8)

我认为只需在您的示波器上使用过滤器表达式功能就可以轻松完成此操作;

$scope.filterExpression = function(charge) {
  return (!$scope.level || !charge.condition || 
          ($scope.level.condition.toUpperCase() === charge.condition.toUpperCase()));
}

并像这样称呼它;

<span ng-repeat="charge in charges | filter:filterExpression">

plunkr (已更正)

答案 2 :(得分:3)

你可以使用: data-ng-repeat =“费用收费|过滤器:searchText”data-ng-if =“filter = searchText.Name”

答案 3 :(得分:-3)

一个接一个地使用两个ng-repeats:

1st:过滤任何已选中复选框且条件

的内容

第二:过滤掉没有条件的东西