Javascript 将参数传递给 angularjs 过滤器
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11753321/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Passing arguments to angularjs filters
提问by shapeshifter
Is it possible to pass an argument to the filter function so you can filter by any name?
是否可以将参数传递给过滤器函数，以便您可以按任何名称进行过滤？
Something like
就像是
$scope.weDontLike = function(item, name) {
console.log(arguments);
return item.name != name;
};
回答by Denis Pshenov
Actually there is another (maybe better solution) where you can use the angular's native 'filter' filter and still pass arguments to your custom filter.
实际上还有另一个（可能更好的解决方案），您可以在其中使用 angular 的原生“过滤器”过滤器，并且仍然将参数传递给您的自定义过滤器。
Consider the following code:
考虑以下代码：
<div ng-repeat="group in groups">
<li ng-repeat="friend in friends | filter:weDontLike(group.enemy.name)">
<span>{{friend.name}}</span>
<li>
</div>
To make this work you just define your filter as the following:
要完成这项工作，您只需将过滤器定义如下：
$scope.weDontLike = function(name) {
return function(friend) {
return friend.name != name;
}
}
As you can see here, weDontLike actually returns another function which has your parameter in its scope as well as the original item coming from the filter.
正如您在此处看到的，weDontLike 实际上返回另一个函数，该函数在其范围内包含您的参数以及来自过滤器的原始项目。
It took me 2 days to realise you can do this, haven't seen this solution anywhere yet.
我花了 2 天的时间才意识到你可以做到这一点，还没有在任何地方看到过这个解决方案。
Checkout Reverse polarity of an angular.js filterto see how you can use this for other useful operations with filter.
查看angular.js 过滤器的反向极性以了解如何将其用于过滤器的其他有用操作。
回答by pkozlowski.opensource
From what I understand you can't pass an arguments to a filter function (when using the 'filter' filter). What you would have to do is to write a custom filter, sth like this:
据我了解，您不能将参数传递给过滤器函数（使用“过滤器”过滤器时）。您需要做的是编写一个自定义过滤器，如下所示：
.filter('weDontLike', function(){
return function(items, name){
var arrayToReturn = [];
for (var i=0; i<items.length; i++){
if (items[i].name != name) {
arrayToReturn.push(items[i]);
}
}
return arrayToReturn;
};
Here is the working jsFiddle: http://jsfiddle.net/pkozlowski_opensource/myr4a/1/
这是工作的 jsFiddle：http: //jsfiddle.net/pkozlowski_opensource/myr4a/1/
The other simple alternative, without writing custom filters is to store a name to filter out in a scope and then write:
另一个简单的替代方法，不编写自定义过滤器是存储一个名称以在范围内过滤掉，然后编写：
$scope.weDontLike = function(item) {
return item.name != $scope.name;
};
回答by mikel
Actually you can pass a parameter ( http://docs.angularjs.org/api/ng.filter:filter) and don't need a custom function just for this. If you rewrite your HTML as below it'll work:
实际上，您可以传递一个参数（http://docs.angularjs.org/api/ng.filter:filter）并且不需要为此自定义函数。如果您按如下方式重写 HTML，它将起作用：
<div ng:app>
<div ng-controller="HelloCntl">
<ul>
<li ng-repeat="friend in friends | filter:{name:'!Adam'}">
<span>{{friend.name}}</span>
<span>{{friend.phone}}</span>
</li>
</ul>
</div>
</div>
回答by abhaygarg12493
You can simply do like this In Template
你可以简单地在模板中这样做
<span ng-cloak>{{amount |firstFiler:'firstArgument':'secondArgument' }}</span>
In filter
过滤器中
angular.module("app")
.filter("firstFiler",function(){
console.log("filter loads");
return function(items, firstArgument,secondArgument){
console.log("item is ",items); // it is value upon which you have to filter
console.log("firstArgument is ",firstArgument);
console.log("secondArgument ",secondArgument);
return "hello";
}
});
回答by Nasif Md. Tanjim
Extending on pkozlowski.opensource's answerand using javascript array'sbuiltin filter method a prettified solution could be this:
扩展pkozlowski.opensource 的答案并使用 javascriptarray's内置过滤器方法，一个美化的解决方案可能是这样的：
.filter('weDontLike', function(){
return function(items, name){
return items.filter(function(item) {
return item.name != name;
});
};
});
Here's the jsfiddle link.
这是 jsfiddle链接。
More on Array filter here.
更多关于数组过滤器在这里。
回答by Partha Roy
You can pass multiple arguments to angular filter !
您可以将多个参数传递给角度过滤器！
Defining my angular app and and an app level variable -
定义我的角度应用程序和应用程序级别变量 -
var app = angular.module('filterApp',[]);
app.value('test_obj', {'TEST' : 'test be check se'});
Your Filter will be like :-
您的过滤器将类似于：-
app.filter('testFilter', [ 'test_obj', function(test_obj) {
function test_filter_function(key, dynamic_data) {
if(dynamic_data){
var temp = test_obj[key];
for(var property in dynamic_data){
temp = temp.replace(property, dynamic_data[property]);
}
return temp;
}
else{
return test_obj[key] || key;
}
}
test_filter_function.$stateful = true;
return test_filter_function;
}]);
And from HTML you will send data like :-
从 HTML 中，您将发送如下数据：-
<span ng-bind="'TEST' | testFilter: { 'be': val, 'se': value2 }"></span>
Here I am sending a JSON object to the filter. You can also send any kind of data like string or number.
在这里，我将一个 JSON 对象发送到过滤器。您还可以发送任何类型的数据，如字符串或数字。
also you can pass dynamic number of arguments to filter , in that case you have to use argumentsto get those arguments.
您也可以将动态数量的参数传递给 filter ，在这种情况下，您必须使用参数来获取这些参数。
For a working demo go here - passing multiple arguments to angular filter
对于工作演示，请转到此处 - 将多个参数传递给角度过滤器
