Question

我明白要用ng-repeat过滤一个对象：

 <div ng-repeat = "name in names | filter: {name: 'David'}"></div>

然而，如果我想展示'大卫'和'安德鲁'

，该怎么办？

我试过了

<div ng-repeat = "foo in fooObj | filter: {name: 'David' && 'Andrew'}"></div>

和

<div ng-repeat = "foo in fooObj | filter: {name: 'David'} | filter: {name: 'Andrew'}"></div>

两者都不按我想要的方式工作。这是我需要自定义过滤器的情况还是我没有看到的API？

Answer 1

试试这个：

HTML 的

<div ng-controller="NameController">
  <div ng-repeat="name in names | filter: 'David,Andrew': compare">
    {{name}}
  </div>
</div>

JS

app.controller(NameController, function($scope) {
    $scope.names = [
        'David',
        'Andrew',
        'Charles',
        ...
    ];
    $scope.compare = function(name, expected) {
        var expectedNames = expected.split(',');
        return expectedNames.indexOf(name) > -1;
    });
});

Answer 2

HTML 的

<div ng-repeat = "name in names | filter: nameFilter "></div>

控制器

$scope.nameFilter = function(name){
        if (object.name === 'David' || object.name === 'Andrew'){
            return object.name;
        } else {
            return;
        }
    };

显然@ Materik的解决方案是可重复使用的，我实际上会把它放在我的过滤器模块中供以后使用！再次感谢

Answer 3

如果有人仍然遇到这些类型的过滤器问题。我知道OP并不像这个那样需要复杂的解决方案。但是，处理多维数组或对象的任何人都无法使用接受的答案。

这是我的解决方案。我花了一些时间来结合几种不同的策略来获得我想要的过滤器。同样的策略可以应用于许多不同的场景，具有各种数据模型。

数据模型示例

items: {
   item: {
     type: { 'foo' }
   },
   item: {
     type: { 'bar' }
   },
   item: {
     type: { 'foo' }
   },
   item: {
     type: { 'blah' }
   }
 }

我的重复

data-ng-repeat="item in items | filter:searchText | filterByType:['foo', 'meh']"

最后这是我的过滤功能。我创建了一个模块级过滤器。

 angular.module('items')
 .filter('filterByType', function () {
  return function (items, types) {
    var filtered = [];

    filtered = items.filter(function (item) {
        return types.indexOf(item.type) !== -1;            
    });

    return filtered;        
  };
});

角度过滤ng-repeat对象

3 个答案: