Question

我正在尝试使用值数组过滤项目列表。到目前为止，我已经成功地过滤了表格中的多个字段，但我还没有能够使用表格的一列中的多个值进行过滤。此plunker显示正在使用此过滤器对象

codegen test_coder.m -args {0}

但是，我想要根据此过滤器对象生成过滤列表：

$scope.filters = {
   user:{
     name:"John"
   },
   status:{
     name: "Approved" 
   }
};

基本上我想要一份所有Johns的列表，其状态名称是＆＃34; Approved＆＃34;或者＆＃34; For Review＆＃34;。

是否可以使用Angular＆＃34;过滤器＆＃34;来实现这一目标。过滤，或者这是自定义过滤器的工作？

Answer 1

您需要为此使用自定义过滤器。或者您也可以按状态数组过滤以按用户名过滤：

$scope.filtered = $filter('filter')($scope.users, {user: $scope.filters.user}).filter(function(user) {
    return $scope.filters.status.name.indexOf(user.status.name) > -1;
});

演示： http://plnkr.co/edit/KcP6bLujFnxFPXrVRfUp?p=preview

Answer 2

我认为一种好的方法是将关于属性的所有过滤逻辑封装到过滤器本身中，并根据它的作用命名过滤器。在此示例中，您有两个过滤器：按用户和按状态。碰巧的是，目前您只是通过一个属性过滤每个过滤器：名称，但将来您可能有多个属性可以在用户和状态。

考虑到上述情况，我建议为您的模块安装以下两个过滤器：

app.filter('byStatus', function() {
  return function(items, filter) {
    var out = [];
    //status.name
    angular.forEach(items, function(item) {
      if (filter.name.constructor != Array) {
        if (filter.name == item.status.name) {
          out.push(item);
        }
      } else if (filter.name.indexOf(item.status.name) > -1) {
        out.push(item);
      }
    });
    return out;
  };
});
app.filter('byUser', function() {
  return function(items, value) {
    var out = [];
    //user.name
    angular.forEach(items, function(item) {
      if (item.user.name.indexOf(value.name) > -1) {
        out.push(item);
      }
    });
    return out;
  };
});

Plunker：http://plnkr.co/edit/g3ERmycps8Fg6trE1NfN?p=preview

有两个$ filter调用，但这很好，我总是鼓励清晰的代码而不是性能。

Answer 3

Html： -

<table id="searchTextResults">
  <tr><th>Name</th><th>Phone</th><th>Status</th></tr>
  <tr ng-repeat="friend in friends | filter: myFilter">
    <td>{{friend.user.name}}</td>
    <td>{{friend.phone}}</td>
    <td>{{friend.status.name}}</td>
  </tr>
</table>

自定义过滤器： -

$scope.myFilter = function (item) { 
    return item.status.name === 'For Review' || item.status.name === 'Approved'; 
};

通过值数组进行角度过滤

3 个答案: