angularjs - 带有OR滤镜的ngRepeat

时间:2014-01-20 17:16:33

标签: angularjs angularjs-ng-repeat

我有一个包含项目的列表(名称:String,age:Int,checked:Boolean)。 此列表显示为ng-repeat。 我想让用户使用搜索字段搜索列表,搜索不得影响已检查值。

  • 只有在用户在搜索字段中输入内容时才会触发搜索
  • 如果填写了搜索字段,搜索应该照常过滤,不得过滤掉选中的项目。

我尝试创建自定义过滤器。我在使用OR逻辑理解$ filter('filter')函数时遇到了问题。

有人能帮我解开脑中的结吗?

app.filter('mySearchFilter', function($filter) {
    return function(data, searchText) {

        if(!searchText || searchText.length === 0) {
            return data;
        }

        console.log(searchText);

        return $filter('filter')(data, searchText);
        //how can I provide additional, OR-concatinated, filter-criteria?
    }
});

查看我的plunk以获取最小示例代码。

http://plnkr.co/edit/3xHLOrSPD3XZy2K9U2Og?p=preview

1 个答案:

答案 0 :(得分:1)

据我了解,您正在寻找一个联合函数。下划线提供这样的功能。有了这个,您可以用这种方式编写过滤器:

app.filter('mySearchFilter', function($filter) {
   return function(data, searchText) {

       if(!searchText || searchText.length === 0) {
           return data;
       }

       var allChecked = data.filter(function(d){return d.checked});
       var allMatched = $filter('filter')(data, searchText);
       return _.union(allMatched, allChecked);
   }
});

查看:http://documentcloud.github.io/underscore/#union并且不要忘记包含脚本:

<script src="http://documentcloud.github.io/underscore/underscore.js"></script>

PLUNKR