Как мне вызвать фильтр Angular.js с несколькими аргументами?


297

Начиная с документации , мы можем назвать такой фильтр, как дата :

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

Здесь date - это фильтр, который принимает один аргумент.

Каков синтаксис для вызова фильтров с большим количеством параметров как из шаблонов, так и из кода JavaScript?

Ответы:


621

В шаблонах вы можете разделять аргументы фильтра двоеточиями .

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

Из Javascript вы называете это как

$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>

4
Привязка к шаблону HTML {{filter_expression | фильтр: выражение: компаратор}}, В JavaScript $ фильтр ('фильтр') (filter_expression, выражение, компаратор)
Роман Скляров

@pulkitsinghal что ты имеешь ввиду? Покажите ваш проблемный код в JSFiddle или Plunker.
Роман Скляров

Было бы неплохо, если бы вы только что разместили фильтр в Javascript
Оби

1
@ObiOnuorah Хорошо, только что перевел Coffeescript на Javascript.
nh2

1
Хорошая вещь. Почему этот ответ не находится в верхней части списка?
thethakuri

11

я упомянул ниже, где я также упомянул пользовательский фильтр, как вызвать этот фильтр, имеющий два параметра

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» с помощью символа:


4

Если вы хотите вызвать свой фильтр внутри ng-options, код будет следующим:

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

где фильтр - sizeWithPriceFilter и имеет два параметра product и productSize



0

Если вам нужно две или более сделки с фильтром, можно связать их:

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

возможный дубликат: stackoverflow.com/questions/16227325/…
sjokkogutten

1
Не отвечает на вопрос "Как мне вызвать фильтр Angular.js с несколькими аргументами?" (а не «Как мне вызвать несколько фильтров?»)
rom99

-1

В этом коде jsondata - это наш массив, а в функции return мы проверяем «версию», присутствующую в 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]); 
Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.