it-swarm.com.de

Wie rufe ich einen Angular.js-Filter mit mehreren Argumenten auf?

Ab dem Dokumentation können wir einen Filter wie Datum folgendermaßen aufrufen:

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

Hier ist Datum ein Filter, der ein Argument akzeptiert.

Wie lautet die Syntax, um Filter mit mehr Parametern sowohl aus Vorlagen als auch aus JavaScript-Code aufzurufen?

291
nh2

In Vorlagen können Sie Filterargumente durch Doppelpunkte trennen.

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

Von Javascript nennen Sie es als

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

In den orderBy Filterdokumenten ist tatsächlich ein Beispiel versteckt.


Beispiel:

Angenommen, Sie erstellen einen Filter, der Dinge durch reguläre Ausdrücke ersetzen kann:

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

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

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

  };
});

Aufruf in einer Vorlage zum Zensieren aller Ziffern:

<p>{{ myText | regexReplace: '[0-9]':'X' }}</p>
608
nh2

ich erwähnte im Folgenden, wo ich den benutzerdefinierten Filter auch erwähnt habe, wie man diesen Filter aufruft, der zwei Parameter hat

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;
    }
});

und aus dem html mit der vorlage können wir diesen filter wie folgt aufrufen

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

wenn Sie hier sehen, ist der erste Parameter inputString und der zweite Parameter ist true. Dies wird mit "reverse" über das Symbol: kombiniert

10
Bravo

Wenn Sie Ihren Filter innerhalb von ng-options aufrufen möchten, lautet der Code wie folgt:

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

wobei der Filter sizeWithPriceFilter ist und zwei Parameter hat: product und productSize

4
shacharsol

so was:

var items = $filter('filter')(array, {Column1:false,Column2:'Pending'});
1
Amay Kulkarni

Wenn Sie zwei oder mehr Umgang mit dem Filter benötigen, ist es möglich, sie zu verketten:

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