Birden çok bağımsız değişkeni olan bir Angular.js filtresini nasıl çağırırım?


297

Dokümantasyondan itibaren, tarih gibi bir filtreyi şu şekilde çağırabiliriz :

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

Burada tarih bir argüman alan bir filtredir.

Hem şablonlardan hem de JavaScript kodundan daha fazla parametreye sahip filtreleri aramak için sözdizimi nedir?

Yanıtlar:


621

Şablonlarda, filtre bağımsız değişkenlerini iki nokta üst üste ile ayırabilirsiniz .

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

Javascript'ten,

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

Aslında orderBy filtre belgelerinde gizli bir örnek var .


Misal:

Diyelim ki düzenli ifadelerle yer değiştirebilecek bir filtre oluşturdunuz:

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

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

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

  };
});

Tüm basamakları sansürlemek için bir şablonda başlatma:

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

4
HTML Şablon Bağlamasında {{filter_expression | filter: expression: comparator}}, JavaScript $ filter'te ('filter') (filter_expression, expression, comparator)
Roman Sklyarov

@pulkitsinghal ne demek istiyorsun? Sorunlu kodunuzu JSFiddle veya Plunker'da gösterin.
Roman Sklyarov

Filtreyi Javascript
Obi'de

1
@ObiOnuorah Tamam, sadece Coffeescript'i Javascript'e çevirdim.
nh2

1
İyi şeyler. Bu cevap neden listenin başında değil?
thethakuri

11

aşağıda özel filtre de bahsettiğim, aşağıda iki parametre olan bu filtre nasıl çağırdı

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

ve şablonu kullanarak html'den bu filtreyi aşağıdaki gibi çağırabiliriz

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

burada görürseniz, ilk parametre inputString ve ikinci parametre true:


4

Filtrenizi ng-seçenekleri içerisinde aramak istiyorsanız kod aşağıdaki gibi olacaktır:

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

filtrenin sizeWithPriceFilter olduğu ve iki parametre ürünü ve productSize olduğu


1

bunun gibi:

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


-1

Bu kodda, jsondata bizim dizimizdir ve işlev dönüşünde jsondata'da bulunan 'sürümü' kontrol ediyoruz.

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

console.log("name is " + as[0].name+as[0]); 
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.