Question

我有一系列看起来像

的员工

$scope.Arr = [
           {'name':'John','title':'CEO','Age':'32'}, 
           {'name':'Jill', 'title':'Sales Executive', 'Age':'44'},
           {'name':'Alex','title':'Developer','Age':24}
          ];

我使用ng-repeat在html中呈现此数组，并希望使过滤器工作，以便可以使用相同的输入控件值来基于name同时过滤员工为title。

<input type='text' data-ng-model='search.name' />

<div>
  <span data-ng-repeat="emp in Arr | filter:search">
  <p> {{emp.name}} </p>
  <p> {{emp.title}} </p>
  </span>
</div>

以上代码只允许我根据员工姓名

进行过滤

Answer 1

您可以使用过滤器根据名称和标题进行搜索。

表达式＆＃34;在Arr |中的默认angularjs过滤器filter：{name：$ select.search，title：$ select.search}＆＃34;在＆＃34;名称之间执行AND：$ select.search＆＃34;和＆＃34;标题：$ select.search＆＃34;

编写自定义过滤器以执行OR操作

var app = angular.module('myApp', []);

app.filter('customFilter', function() {
    return function(names, title) {
        var output = [];

        if(angular.isArray(names)) {
            names.forEach(function(item) {
                var nameMatch = false;

                var keys = Object.keys(title);
                for(var i=0; i<keys.length; ++i) {
                    var t = keys[i];
                    var text = title[t].toLowerCase();
                    if(item[t].toString().toLowerCase().indexOf(text) !== -1) {
                        nameMatch = true;
                        break;
                    }
                }

                if(nameMatch) {
                    output.push(item);
                }
             });
          }
          else {
              output = names;
       }

       return output;
   };
});

基本上，此代码允许您根据名称和标题进行过滤。希望这会有所帮助。

Angular JS - ng-repeat过滤器对象数组，基于使用相同ng模型的多个对象属性

1 个答案: