¿Cómo llamo a un filtro Angular.js con múltiples argumentos?

297

A partir de la documentación , podemos llamar a un filtro como la fecha de esta manera:

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

Aquí la fecha es un filtro que toma un argumento.

¿Cuál es la sintaxis para llamar a los filtros con más parámetros tanto de plantillas como de código JavaScript?

nh2
fuente

Respuestas:

621

En las plantillas, puede separar los argumentos de filtro por dos puntos .

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

Desde Javascript, lo llamas como

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

En realidad, hay un ejemplo oculto en los documentos de orderBy filter.


Ejemplo:

Digamos que haces un filtro que puede reemplazar cosas con expresiones regulares:

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

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

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

  };
});

Invocación en una plantilla para censurar todos los dígitos:

<p>{{ myText | regexReplace: '[0-9]':'X' }}</p>
nh2
fuente
44
En Enlace de plantilla HTML {{filter_expression | filter: expression: comparator}}, en JavaScript $ filter ('filter') (filter_expression, expression, comparator)
Roman Sklyarov
@pulkitsinghal, ¿qué quieres decir? Muestra tu código problemático en JSFiddle o Plunker.
Roman Sklyarov
Hubiera sido agradable si acaba de publicar el filtro en Javascript
Obi
1
@ObiOnuorah OK, acabo de traducir el Coffeescript a Javascript.
nh2
1
Buen material. ¿Por qué esta respuesta no está en la parte superior de la lista?
thethakuri
11

mencioné en el siguiente donde también he mencionado el filtro personalizado, cómo llamar a este filtro que tiene dos parámetros

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

y desde el html usando la plantilla podemos llamar a ese filtro como a continuación

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

aquí, si ve, el primer parámetro es inputString y el segundo parámetro es verdadero, que se combina con "reverse" usando el símbolo:

Bravo
fuente
4

Si desea llamar a su filtro dentro de ng-options, el código será el siguiente:

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

donde el filtro es sizeWithPriceFilter y tiene dos parámetros product y productSize

shacharsol
fuente
1

Me gusta esto:

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

Si necesita dos o más tratos con el filtro, es posible encadenarlos:

{{ value | decimalRound: 2 | currencySimbol: 'U$' }} 
// 11.1111 becomes U$ 11.11
Jonatas Marinho
fuente
posible duplicado: stackoverflow.com/questions/16227325/…
sjokkogutten
1
No aborda la pregunta "¿Cómo llamo a un filtro Angular.js con múltiples argumentos?" (en lugar de "¿Cómo llamo a varios filtros?")
rom99
-1

En este código, jsondata es nuestra matriz y en función de retorno estamos verificando la 'versión' presente en la 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]); 
Gajender Singh
fuente