Question

以下是模板中Angularjs过滤器的简单方案：

<input ng-model="query">         
<li ng-repeat="item in filtered = (prosItems.results |filter:mySearch)">

因为我只需要从prosItems.results过滤特定字段，所以我在控制器中创建了一个特定的函数：

$scope.mySearch = function (item){
            if ($scope.query) {
                var searchTerm = $scope.query.toLocaleLowerCase();
                return item.firstName.toLowerCase().indexOf(searchTerm)!==-1 ||
                    item.lastName.toLowerCase().indexOf(searchTerm)!==-1 ||
                    item.company.toLowerCase().indexOf(searchTerm)!==-1 ||
                    item.city.toLowerCase().indexOf(searchTerm)!==-1   ||
                    item.state.toLowerCase().indexOf(searchTerm)!==-1    ||
                    item.country.toLowerCase().indexOf(searchTerm)!==-1;
            } else {
                return true;
            }
        };

问题是当迭代的任何属性未定义时，例如，如果用户未在条目上指定“公司”，我将在输入字段中输入内容后立即收到该错误：

Cannot call method 'toLowerCase' of undefined

如果我只有一个属性来迭代槽，我可以想象解决方案，但由于我有几个，我没有看到这样做的实用方法。你有没有办法解决这个问题呢？

Answer 1

这样的事情：

var fields = ['firstName', 'lastName', 'company', 'etc'];
for(var i = 0, l = fields.length; i < l; i ++){
   if(item[fields[i]] && item[fields[i]].toLowerCase().indexOf(searchTerm)!==-1){
       return true;
   }
}
return false;

Answer 2

我试过死的简单：

$scope.mySearch = function (item){
            if ($scope.query) {
                var searchTerm = $scope.query.toLocaleLowerCase();
                var  city = item.city || 'null',
                    state = item.state ||  'null',
                    company = item.company || 'null',
                    country = item.country || 'null';
                return item.firstName.toLowerCase().indexOf(searchTerm)!==-1 ||
                    item.lastName.toLowerCase().indexOf(searchTerm)!==-1 ||
                    company.toLowerCase().indexOf(searchTerm)!==-1 ||
                    city.toLowerCase().indexOf(searchTerm)!==-1 ||
                    state.toLowerCase().indexOf(searchTerm)!==-1 ||
                    country.toLowerCase().indexOf(searchTerm)!==-1;
            } else {
                return true;
            }
        };

似乎可以胜任这项工作，但这是一种很好的做法吗？

自定义过滤功能无法调用undefined方法

2 个答案: