如何创建一个过滤器来过滤AngularJS中的ng-model值？答案

【问题标题】：how to create a filter to filter ng-model value in AngularJS?如何创建一个过滤器来过滤AngularJS中的ng-model值？
【发布时间】：2017-05-30 02:17:34
【问题描述】：

我有一个输入字段：

<input type="text" ng-model="defaultValue">

在我的控制器中它是一个空字符串：

$scope.defaultValue = "";

我想创建一个过滤器来比较对象中的值，例如：

   items: [
    {
    repo_status: null,
    cyberridge_loan_number: "FH00-0012-0003-0012",
    repo_id: 18,
    cr_loan_status: "CLOSED",
    eff_days_delinquent: null,
    principal_balance: null,
    preemptive_charge_off_balance: 0,
    total_final_charge_off_balance: 0
    },
    ...
]

例如：比较 repo_id > 18？我创建了一个 ng-repeat：

<li ng-repeat="(key, value) in data.items[0]">{{value}}</li>

（因为这个 ng-repeat 是针对所有相同格式的 api，所以我使用了 {key, value} 对）

但是如何制作像 (repo_id > 18 ?) 这样的逻辑过滤器并应用于 ng-repeat？

非常感谢！

【问题讨论】：

标签： angularjs filter angularjs-ng-repeat

【解决方案1】：

您可以像这样创建自定义过滤器，

 $scope.greaterThan = function(prop, val) {
      return function(item) {
        if (item[prop] > val) return true;
      }
    }

演示

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

app.controller('MyController', function($scope) {
    $scope.defaultValue  = 0;
    
    $scope.items = [{
      repo_status: null,
      cyberridge_loan_number: "FH00-0012-0003-0012",
      repo_id: 18,
      cr_loan_status: "CLOSED",
      eff_days_delinquent: null,
      principal_balance: null,
      preemptive_charge_off_balance: 0,
      total_final_charge_off_balance: 0
    },
    {
      repo_status: null,
      cyberridge_loan_number: "FH00-0012-0003-0012",
      repo_id: 34,
      cr_loan_status: "OPEN",
      eff_days_delinquent: null,
      principal_balance: null,
      preemptive_charge_off_balance: 0,
      total_final_charge_off_balance: 0
    }];
    
    $scope.greaterThan = function(prop, val) {
      return function(item) {
        if (item[prop] > val) return true;
      }
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app="myApp" ng-controller="MyController">
  <input type="text" ng-model="defaultValue">
  <ul>
    <li ng-repeat="item in items | filter: greaterThan('repo_id', defaultValue)">         {{item}}
    </li>
  </ul>
</div>

【讨论】：

非常感谢！