Question

我使用angularJS创建项目列表。现在我想过滤，以便我可以同时搜索多个列。例如，如果我搜索“Bob”将显示包含“Bob”的所有列，然后我继续搜索“Bob 073”，所有包含名称“Bob”的列和包含“073”的电话号码将显示

我创建了一个实现类似功能的过滤器，但是硬编码到特定列，只有在我搜索这两列时才有效。

app.filter('appFilter', function () {
    return function (data, search) {
        if (!search) {
            return data;
        } else {
            var term = search;
            var termsArray = term.split(' ');

            return data.filter(function(item){
                return item.name.indexOf(termsArray[0]) > -1 && item.phone.indexOf(termsArray[1]) > -1;  
           });
        }
    }
});

<input type="search" ng-model="search">
<div ng-repeat="item in items | appFilter:search )">
    {{item.name}}, {{item.phone}}
</div>

我希望你理解我的意思。

感谢。

Answer 1

myApp.filter('filterMultiple', ['$filter', function ($filter) {
return function (items, keyObj) {
    var filterObj = {
        data: items,
        filteredData: [],
        applyFilter: function (obj, key) {
            var fData = [];
            if (this.filteredData.length == 0)
                this.filteredData = this.data;
            if (obj) {
                var fObj = {};
                if (!angular.isArray(obj)) {
                    fObj[key] = obj;
                    fData = fData.concat($filter('filter')(this.filteredData, fObj));
                } else if (angular.isArray(obj)) {
                    if (obj.length > 0) {
                        for (var i = 0; i < obj.length; i++) {
                            if (angular.isDefined(obj[i])) {
                                fObj[key] = obj[i];
                                fData = fData.concat($filter('filter')(this.filteredData, fObj));
                            }
                        }

                    }
                }
                if (fData.length > 0) {
                    this.filteredData = fData;
                }
            }
        }
    };

    if (keyObj) {
        angular.forEach(keyObj, function (obj, key) {
            filterObj.applyFilter(obj, key);
        });
    }

    return filterObj.filteredData;
}
}]);

用法：

arrayOfObjectswithKeys | filterMultiple:{key1:['value1','value2','value3',...etc],key2:'value4',key3:[value5,value6,...etc]}

同时过滤多个列

1 个答案: