AngularJS 过滤器（对象和多个值）不工作

Question

所以我得到了一个使用 AngularJS 和 UI-Router 的项目，我遍历了一个 json，它有一个叫做 "state" 的属性这是我想用作过滤器的东西，但是，我将使用 "selector"，我可以在其中选择 "All" 或特定的过滤器。

我是 AngularJS 的新手，所以不确定到底是什么不起作用，这是我目前拥有的代码：

function filterState (installment){
    switch(selectedValue) {
        case 1:
            if(installment.state === 'PAID'){
                return installment;
            }
            break;
        case 2:
            if(installment.state === 'LATE'){
                return installment;
            }
            break;
        case 3:
            if(installment.state === 'PENDING'){
                return installment;
            }
            break;
        default:
            return installment;
    }

但是过滤器没有正常工作我是这样称呼它的：

<div class="row" ng-repeat="installment in vm.clients.installments | filter: filterState">

不确定错误到底是什么，当我手动按值过滤时，如过滤器：{state:'PAID'} 有效

Answer 1

过滤函数returns一个迭代器函数。像回调。请检查以下示例。

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

app.controller('MainCtrl', function($scope) {
  $scope.criteria = { name: 'Bob'};

  $scope.criteriaMatch = function( criteria ) {
    return function( item ) {
      return item.name === criteria.name;
    };
  };

  $scope.items =[
    { name: 'Bob'},
    { name: 'Alice'}
  ];
});

<div ng-repeat="item in items | filter:criteriaMatch(criteria)">
  {{ item }}
</div>

http://plnkr.co/edit/vtNjEgmpItqxX5fdwtPi?p=preview

来源：匿名

Answer 2

如果您需要使用 select 选项进行过滤，那么您可以这样做：

<select name="select" id="select" ng-model="clients.status">
    <option value="PAID">PAID</option>
    <option value="LATE">LATE</option>
    <option value="PENDING">PENDING</option>
    <option value="ALL">ALL</option>
</select>
<div class="row" ng-repeat="installment in clients.installments | filter: filterState">
    {{installment.id}}
</div>

并在控制器中过滤函数：

$scope.filterState = function(installment) {
    if ($scope.clients.status === 'ALL') return true;
    return $scope.clients.status === installment.status;
};

When option ALL is selected, it shows all the items of the list

在此处查看工作演示：DEMO

Answer 3

显然我需要 return 一个布尔值而不是对象，我之前确实尝试过，但我的另一个问题是我直接调用函数而不是 vm.function （一次传递给上下文），在这样做之后它起作用了。

AngularJS 过滤器（对象和多个值）不工作

AngularJS filter (object and multiple values) not working

angularjs

angular-ui-router

angularjs-filter