Question

我有一个自定义角度过滤器，我试图使其更通用。过滤器查看员工的集合，并根据自雇用以来经过的月数过滤列表。我正在尝试使过滤器更通用，因此我可以在具有日期但具有不同属性名称的其他列表上使用它（例如：在最近的xx个月中创建的过滤器发票）。如何传递我想要过滤的属性的名称，或者如何传递date属性的集合而不是整个对象？

HTML

<html  ng-app="dateFilterTest">
    <head>

    </head>
    <body ng-controller="filterController">
        <select ng-model="maxLookBack">
            <option value="6">6 Months</option>
            <option value="12" selected="selected">1 Year</option>
            <option value="24">2 Year</option>
            <option value="999">All</option>
        </select>
        <ul>
            <li ng-repeat="person in people | DateAgeFilter:maxLookBack">{{person.name}}</li>
        </ul>
    </body>

    <script type="text/javascript" src="js/angular.min.js"></script>
    <script type="text/javascript" src="js/controllers/dateFiltercontroller.js"></script>
</html>

JS

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

app.filter('DateAgeFilter', function(){
    return function(items, maxage) {

        var minDate = new Date()
        minDate.setMonth(minDate.getMonth() - maxage);

        var result = [];
        for (var i=0; i<items.length; i++) {
          if (items[i].hireDate.getTime() > minDate.getTime()) {
            result.push(items[i]);
          }
        }

        return result;
    };
});

app.controller('filterController', function($scope){
    $scope.people = [
        {'name': 'Person 1',
         'hireDate': new Date('Jun 1, 2013')},
        {'name': 'Person 2',
         'hireDate': new Date('Aug 1, 2012')},
        {'name': 'Person 3',
         'hireDate': new Date('May 1, 2011')},
        {'name': 'Person 4',
         'hireDate': new Date('Jun 1, 2012')},
        {'name': 'Person 5',
         'hireDate': new Date('Mar 1, 2014')},
        {'name': 'Person 6',
         'hireDate': new Date('Mar 1, 2014')},
    ];
});

plunker：

http://plnkr.co/edit/9zOWxJdMNg5zHz7qYf7c

Answer 1

您可以将属性名称作为附加参数传递给类似过滤器（使用额外的冒号分隔符）：

DateAgeFilter:maxLookBack:'hireDate'

以下是更改过滤器以使用该过滤器的示例，其中包含2项更改：

1）附加参数 - 我在这里称它为field。

2）为了使用参数指定属性，我们从点表示法切换到括号表示法 - 将items[i].hireDate.getTime()更改为items[i][field].getTime()

app.filter('DateAgeFilter', function(){
  return function(items, maxage, field) {

    var minDate = new Date()
    minDate.setMonth(minDate.getMonth() - maxage);

    var result = [];
    for (var i=0; i<items.length; i++) {
      if (items[i][field].getTime() > minDate.getTime()) {
        result.push(items[i]);
      }
    }

    return result;
  };
});

updated plunker

传递对象属性数组以进行过滤

1 个答案: