AngularJS过滤多个字符串

Question

我正在学习AngularJS教程,并了解其基础知识

但是,开箱即用的实现似乎仅限于将项目列表过滤为输入的确切单词或短语.

示例:如果查询是"桌布",则结果列表可以包含此短语"装饰表布"的结果,但不包括"装饰布料表",因为过滤器只是一个连续的搜索字符串.

我知道有能力添加自定义过滤器,但乍一看似乎主要是转换.

有没有办法添加自定义过滤器,以便在过滤结果集中显示"装饰桌布"和"装饰桌布"？

Answer 1

对上述自定义过滤器的一些改进:

而不是在循环,count和indexOf中使用循环,这个使用正则表达式来实现逻辑AND以及逻辑OR,这取决于过滤器的第三个参数(字符串的输入数组,搜索项,AND或OR).

看看分叉小提琴有两种类型的过滤器和结果:

http://jsfiddle.net/jonjon/Cx3Pk/23/

angular.module('app', [])
    .filter("myFilter", function () {
    return function (input, searchText, AND_OR) {
        var returnArray = [],
            // Split on single or multi space
            splitext = searchText.toLowerCase().split(/\s+/),
            // Build Regexp with Logical AND using "look ahead assertions"
            regexp_and = "(?=.*" + splitext.join(")(?=.*") + ")",
            // Build Regexp with logicial OR
            regexp_or = searchText.toLowerCase().replace(/\s+/g, "|"),
            // Compile the regular expression
            re = new RegExp((AND_OR == "AND") ? regexp_and : regexp_or, "i");

        for (var x = 0; x < input.length; x++) {
            if (re.test(input[x])) returnArray.push(input[x]);
        }
        return returnArray;
    }
});

Answer 2

请参阅下面的surfbuds答案,因为它是优越的

只需使用您自己的过滤器:

.filter("myFilter", function(){
    return function(input, searchText){
        var returnArray = [];
        var searchTextSplit = searchText.toLowerCase().split(' ');
        for(var x = 0; x < input.length; x++){
            var count = 0;
            for(var y = 0; y < searchTextSplit.length; y++){
                if(input[x].toLowerCase().indexOf(searchTextSplit[y]) !== -1){
                    count++;
                }
            }
            if(count == searchTextSplit.length){
                 returnArray.push(input[x]);   
            }
        }
        return returnArray;
    }
});

jsfiddle:http://jsfiddle.net/Cq3PF/

此过滤器可确保找到所有搜索词.