1

在 AngularJS 中，如何将参数传递给自定义过滤函数？在这种情况下，我需要两者task和status在过滤器功能中可用。

但 Angular 只注入task. 我该如何添加status？

HTML

<div ng-repeat="status in statuses">
    Selected Status: {{ status.title }
    <ul>
        <li ng-repeat="task in tasks | filter:customFilter">
            Task Status: {{ task.status }
        </li>
    </ul>
</div>

JS

$scope.customFilter = function( task, status ) 
{
    // use task and status to show only those tasks that have the selected status
};

我试过<li ng-repeat="task in tasks | filter:customFilter( task, status )">了，但没有奏效。

4

2 回答 2

2

要将多个参数传递给过滤器，您只需用冒号分隔它们。在使用过滤器功能的情况下，您只需将现有过滤器功能包装在自定义过滤器中即可。

app.filter('customFilterName', ['$filter', function ($filter) {
    var standardFilter = $filter('filter');
    return function (tasks, status) {
        return standardFilter(tasks, function (task) {
            // use task and status to show only those tasks that have the selected status
        });
    };
}]);

第一行是过滤器工厂函数的定义。第二行加载标准过滤器过滤器（我知道愚蠢的命名）。第三行是我们创建的实际过滤器函数的定义，在第四行我们包装现有的过滤器来处理我们的输入。

表面上看有点复杂，但使用自定义命名过滤器和参数使视图中的内容更具可读性，并且摆脱了将对象指定为参数时的许多样板。

在您看来：

<div ng-repeat="status in statuses">
    Status = {{ status.title }
    <ul>
        <li ng-repeat="task in tasks | customFilterName:status">
        </li>
    </ul>
</div>
于 2013-05-29T13:36:43.610 回答
0

编辑： 我最初说 - 你不必用 $filter 包装你的函数 - 它应该按原样工作。要获得外部范围，请使用$parent. - 这是不正确的。在第二个 ng-repeat 中应该可以访问父范围。filter另外，要传递多个参数，应该调用angular 的 native ，正如前面的答案所述：

app.filter('realFilter', function(){
   return function(itemArray, param){
   var filteredList=[];
   console.log(param);
   for (var i in itemArray){
       if (itemArray[i].statum == param){
           filteredList.push(itemArray[i]);
       }
   }
   return filteredList;
   }
})

HTML：

<li ng-repeat="task in tasks | realFilter:status.status">
    Task Status: {{ task.statum }}
</li>

这是笨拙的。

于 2013-05-29T13:40:18.830 回答