it-swarm.com.de

Argumente an eckige Filter übergeben

Kann ein Argument an die Filterfunktion übergeben werden, damit Sie nach einem beliebigen Namen filtern können?

So etwas wie 

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

Tatsächlich gibt es eine andere (möglicherweise bessere Lösung), bei der Sie den nativen "Filter" -Filter des Winkels verwenden und dennoch Argumente an Ihren benutzerdefinierten Filter übergeben können.

Betrachten Sie den folgenden Code:

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

Damit dies funktioniert, definieren Sie Ihren Filter einfach wie folgt:

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

Wie Sie hier sehen können, gibt weDontLike tatsächlich eine andere Funktion zurück, deren Parameter sich in ihrem Gültigkeitsbereich befinden, sowie das ursprüngliche Element, das vom Filter stammt.

Ich habe 2 Tage gebraucht, um zu realisieren, dass Sie dies tun können. Ich habe diese Lösung noch nirgendwo gesehen.

Checkout Polarität eines Winkels.js-Filters umkehren um zu sehen, wie Sie dies für andere nützliche Operationen mit Filter verwenden können.

216
Denis Pshenov

Soweit ich weiß, können Sie keine Argumente an eine Filterfunktion übergeben (wenn Sie den Filter verwenden). Was Sie tun müssen, ist einen benutzerdefinierten Filter zu schreiben.

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

Hier ist die Arbeit von jsFiddle: http://jsfiddle.net/pkozlowski_opensource/myr4a/1/

Die andere einfache Alternative, ohne benutzerdefinierte Filter zu schreiben, besteht darin, einen Namen zu speichern, um ihn in einem Bereich herauszufiltern, und dann Folgendes schreiben:

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

Eigentlich können Sie einen Parameter übergeben ( http://docs.angularjs.org/api/ng.filter:filter ) und brauchen dafür keine eigene Funktion. Wenn Sie Ihren HTML-Code wie folgt umschreiben, funktioniert er:

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

61
mikel

Sie können dies einfach tun In Template

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

Im Filter

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";
    }
    });
28
abhaygarg12493

Die Antwort auf pkozlowski.opensource erweitern und mithilfe der eingebauten Filtermethode array's von Javascript eine vereinfachte Lösung:

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

Hier ist das jsfiddle link .

Mehr zu Array-Filter hier .

2

Sie können mehrere Argumente an den Winkelfilter übergeben!

Definieren meiner Winkel-App und einer App-Level-Variablen 

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

Ihr Filter wird wie folgt aussehen: - 

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

Und von HTML senden Sie Daten wie: - 

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

Hier sende ich ein JSON-Objekt an den Filter. Sie können auch beliebige Daten wie Zeichenfolge oder Zahl senden.

sie können auch eine dynamische Anzahl von Argumenten an den Filter übergeben, In diesem Fall müssen Sie Argumente verwenden, um diese Argumente abzurufen.

Für eine funktionierende Demo gehen Sie hier - übergeben Sie mehrere Argumente an den Winkelfilter

0
Partha Roy