Wie verwende ich Parameter innerhalb des Filters in AngularJS?

Ich möchte Parameter im Filter verwenden, wenn ich einige Arrays mit ng-repeat iteriere

Beispiel:

HTML-Teil:

<tr ng-repeat="user in users | filter:isActive">

JavaScript-Teil:

$scope.isActive = function(user) {
    return user.active === "1";
};

Aber ich möchte in der Lage sein, Filter wie zu verwenden

<tr ng-repeat="user in users | filter:isStatus('4')">

Aber es funktioniert nicht. Wie kann ich so etwas machen?

UPDATE: Ich glaube , ich wirklich in der Dokumentation sah nicht gut genug , aber man kann auf jeden Fall das verwendet Filter mit dieser Syntax (siehe Filter diese Geige ) zum Filter durch eine Eigenschaft auf den Objekten:

<tr ng-repeat="user in users | filter:{status:4}">

Hier ist meine ursprüngliche Antwort für den Fall, dass es jemandem hilft:

Mit dem Filterfilter können Sie keinen Parameter übergeben, aber Sie können mindestens zwei Dinge tun.

1) Legen Sie die Daten, nach denen Sie filtern möchten, in einer Bereichsvariablen fest und verweisen Sie auf diese in Ihrer Filterfunktion wie diese Geige .

JavaScript:

$scope.status = 1;
$scope.users = [{name: 'first user', status: 1},
                {name: 'second user', status: 2},
                {name: 'third user', status: 3}];

$scope.isStatus = function(user){
    return (user.status == $scope.status);
};

Html:

<li ng-repeat="user in users | filter:isStatus">

ODER

2) Erstellen Sie einen neuen Filter, der einen Parameter wie diese Geige berücksichtigt .

JavaScript:

var myApp = angular.module('myApp', []);
myApp.filter('isStatus', function() {
  return function(input, status) {
    var out = [];
      for (var i = 0; i < input.length; i++){
          if(input[i].status == status)
              out.push(input[i]);
      }      
    return out;
  };
});

Html:

<li ng-repeat="user in users | isStatus:3">

Beachten Sie, dass dieser Filter davon ausgeht, dass statusdie Objekte im Array eine Eigenschaft enthalten, die sie möglicherweise weniger wiederverwendbar macht. Dies ist jedoch nur ein Beispiel. Sie können lesen , das auf die Schaffung von Filtern für weitere Informationen.

Diese Frage ist fast identisch mit der Übergabe von Argumenten an AngularJS-Filter , auf die ich bereits eine Antwort gegeben habe. Aber ich werde hier noch eine Antwort posten, damit die Leute sie sehen.

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

Betrachten Sie den folgenden Code:

    <li ng-repeat="user in users | filter:byStatusId(3)">
        <span>{{user.name}}</span>
    <li>

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

$scope.byStatusId = function(statusId) {
    return function(user) {
        return user.status.id == statusId;
    }
}

Dieser Ansatz ist vielseitiger, da Sie Vergleiche mit Werten durchführen können, die tief im Objekt verschachtelt sind.

Kasse Verpolung eines Angular.js-Filters umkehren, um zu sehen, wie Sie dies für andere nützliche Operationen mit Filter verwenden können.

Wenn Sie einen benutzerdefinierten AngularJs-Filter erstellt haben, können Sie mehrere Parameter an Ihren Filter senden. Hier wird die Verwendung in der Vorlage verwendet

{{ variable | myFilter:arg1:arg2...  }}

Wenn Sie Filter in Ihrem Controller verwenden, können Sie dies folgendermaßen tun

angular.module('MyModule').controller('MyCtrl',function($scope, $filter){
    $filter('MyFilter')(arg1, arg2, ...);
})

Wenn Sie mehr mit Beispielen und Online-Demo benötigen, können Sie diese verwenden

AngularJs filtert Beispiele und Demos

Dies mag etwas irrelevant sein, aber wenn Sie versuchen, mehrere Filter mit benutzerdefinierten Funktionen anzuwenden, sollten Sie Folgendes prüfen: https://github.com/tak215/angular-filter-manager

Beispiel Ich habe eine Studentenliste wie folgt:

$scope.students = [  
   { name: 'Hai', age: 25, gender: 'boy' },  
   { name: 'Hai', age: 30, gender: 'girl' },  
   { name: 'Ho', age: 25, gender: 'boy' },  
   { name: 'Hoan', age: 40, gender: 'girl' },  
   { name: 'Hieu', age: 25, gender: 'boy' }  
 ];  

Ich möchte Schüler nach Geschlecht filtern, um ein Junge zu sein, und nach ihrem Namen filtern.

Das erste Mal erstelle ich eine Funktion namens "filterbyboy" wie folgt:

$scope.filterbyboy = function (genderstr) {  
   if ((typeof $scope.search === 'undefined')||($scope.search === ''))  
     return (genderstr = "")  
   else  
    return (genderstr = "boy");  
 };  

Erklärung: Wenn der Name nicht gefiltert wird, werden alle anderen Schüler nach Eingabename und Geschlecht als "Junge" gefiltert.

Hier finden Sie den vollständigen HTML-Code und die Demo. Verwendung und Operator in AngularJs Beispiel