javascript - limitto - Pasar argumentos a filtros angularjs

ng angular

Question

¿Es posible pasar un argumento a la función de filtro para que pueda filtrar por cualquier nombre?

Algo como

$scope.weDontLike = function(item, name) {
    console.log(arguments);
    return item.name != name;
};

Answer 1

¡Puedes pasar múltiples argumentos al filtro angular!

Definiendo mi aplicación angular yy una variable de nivel de aplicación -

var app = angular.module(''filterApp'',[]);
app.value(''test_obj'', {''TEST'' : ''test be check se''});

Su filtro será como:

app.filter(''testFilter'', [ ''test_obj'', function(test_obj) {
    function test_filter_function(key, dynamic_data) {
      if(dynamic_data){
        var temp = test_obj[key]; 
        for(var property in dynamic_data){
            temp = temp.replace(property, dynamic_data[property]);
        }
        return temp;
      }
      else{
        return test_obj[key] || key;
      }

    }
    test_filter_function.$stateful = true;
    return test_filter_function;
  }]);

Y desde HTML, enviarás datos como:

<span ng-bind="''TEST'' | testFilter: { ''be'': val, ''se'': value2 }"></span>

Aquí estoy enviando un objeto JSON al filtro. También puede enviar cualquier tipo de datos como cadena o número.

también puede pasar un número dinámico de argumentos para filtrar, en ese caso debe usar argumentos para obtener esos argumentos.

Para una demostración en funcionamiento, vaya aquí, pasando múltiples argumentos al filtro angular

Answer 2

Ampliando la respuesta de pkozlowski.opensource y usando array''s método de filtro incorporado de array''s JavaScript array''s una solución embellecida podría ser esta:

.filter(''weDontLike'', function(){
    return function(items, name){
        return items.filter(function(item) {
            return item.name != name;
        });
    };
});

Aquí está el link jsfiddle.

Más sobre el filtro Array here .

Answer 3

De hecho, puede pasar un parámetro ( http://docs.angularjs.org/api/ng.filter:filter ) y no necesita una función personalizada solo para esto. Si reescribe su HTML de la siguiente manera, funcionará:

<div ng:app>
 <div ng-controller="HelloCntl">
 <ul>
    <li ng-repeat="friend in friends | filter:{name:''!Adam''}">
        <span>{{friend.name}}</span>
        <span>{{friend.phone}}</span>
    </li>
 </ul>
 </div>
</div>

http://jsfiddle.net/ZfGx4/59/

Answer 4

En realidad, hay otra (tal vez una mejor solución) en la que puede usar el filtro de filtro nativo de angular y aún pasar argumentos a su filtro personalizado.

Considera el siguiente código:

<div ng-repeat="group in groups">
    <li ng-repeat="friend in friends | filter:weDontLike(group.enemy.name)">
        <span>{{friend.name}}</span>
    <li>
</div>

Para que esto funcione, solo defina su filtro de la siguiente manera:

$scope.weDontLike = function(name) {
    return function(friend) {
        return friend.name != name;
    }
}

Como puede ver aquí, weDontLike realmente devuelve otra función que tiene su parámetro en su alcance así como también el elemento original que proviene del filtro.

Me llevó 2 días darme cuenta de que puedes hacer esto, todavía no he visto esta solución en ningún lado.

Checkout Invierta la polaridad de un filtro angular.js para ver cómo puede usar esto para otras operaciones útiles con filtro.

Answer 5

Por lo que entiendo, no puede pasar argumentos a una función de filtro (cuando se usa el filtro ''filtro''). Lo que tendría que hacer es escribir un filtro personalizado, algo así:

.filter(''weDontLike'', function(){

return function(items, name){

    var arrayToReturn = [];        
    for (var i=0; i<items.length; i++){
        if (items[i].name != name) {
            arrayToReturn.push(items[i]);
        }
    }

    return arrayToReturn;
};

Aquí está el jsFiddle de trabajo: http://jsfiddle.net/pkozlowski_opensource/myr4a/1/

La otra alternativa simple, sin escribir filtros personalizados es almacenar un nombre para filtrar en un ámbito y luego escribir:

$scope.weDontLike = function(item) {
  return item.name != $scope.name;
};

Answer 6

Simplemente puede hacer esto en la plantilla

<span ng-cloak>{{amount |firstFiler:''firstArgument'':''secondArgument'' }}</span>

En filtro

angular.module("app")
.filter("firstFiler",function(){

    console.log("filter loads");
    return function(items, firstArgument,secondArgument){
        console.log("item is ",items); // it is value upon which you have to filter
        console.log("firstArgument is ",firstArgument);
        console.log("secondArgument ",secondArgument);

        return "hello";
    }
    });