如何调用带有多个参数的Angular.js过滤器?

从文档开始，我们可以像这样调用日期这样的过滤器:

{{ myDateInScope | date: 'yyyy-MM-dd' }}

这里date是一个带有一个参数的过滤器。

从模板和JavaScript代码调用带有更多参数的过滤器的语法是什么?

218730 次浏览
小开
最佳答案

在模板中，可以通过冒号分隔过滤器参数。

\{\{ yourExpression | yourFilter: arg1:arg2:... }}

在Javascript中，称之为as

$filter('yourFilter')(yourExpression, arg1, arg2, ...)

实际上有一个例子隐藏在orderBy过滤器文档中。

例子:

假设你做了一个过滤器，可以用正则表达式替换东西:

myApp.filter("regexReplace", function() { // register new filter


return function(input, searchRegex, replaceRegex) { // filter arguments


return input.replace(RegExp(searchRegex), replaceRegex); // implementation


};
});

在模板中调用来检查所有数字:

<p>\{\{ myText | regexReplace: '[0-9]':'X' }}</p>
小开

我在下面提到了自定义过滤器，如何调用这些过滤器，它有两个参数

countryApp.filter('reverse', function() {
return function(input, uppercase) {
var out = '';
for (var i = 0; i < input.length; i++) {
out = input.charAt(i) + out;
}
if (uppercase) {
out = out.toUpperCase();
}
return out;
}
});

在HTML中使用模板，我们可以像下面这样调用这个过滤器

<h1>\{\{inputString| reverse:true }}</h1>

在这里，如果你看到，第一个参数是inputString，第二个参数是true，它与“reverse”结合使用:符号

小开

如果你想在ng-options中调用你的过滤器，代码如下:

ng-options="productSize as ( productSize | sizeWithPrice: product )  for productSize in productSizes track by productSize.id"

其中过滤器是sizeWithPriceFilter，它有两个参数product和productSize

小开

如果你需要两个或更多的交易过滤器，是可以链他们:

\{\{ value | decimalRound: 2 | currencySimbol: 'U$' }}
// 11.1111 becomes U$ 11.11
小开

是这样的:

var items = $filter('filter')(array, {Column1:false,Column2:'Pending'});
小开

在这段代码中，jsondata是我们的数组，在函数返回中，我们检查jsondata中的“版本”。

var as = $filter('filter')(jsondata, function (n,jsondata){
return n.filter.version==='V.0.3'
});


console.log("name is " + as[0].name+as[0]);

提交答案