Come utilizzare i parametri all’interno del filtro in AngularJS?

Voglio usare il parametro nel filtro, quando eseguo l’iterazione di alcuni array con ng-repeat

Esempio:

HTML-Part:

 

JavaScript-parte:

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

Ma voglio essere in grado di usare filtri come

  

Ma non funziona. Come posso fare qualcosa del genere?

AGGIORNAMENTO: Credo di non aver letto abbastanza bene la documentazione ma si può sicuramente usare il filtro con questa syntax (vedi questo violino ) per filtrare da una proprietà sugli oggetti:

  

Ecco la mia risposta originale nel caso in cui aiuti qualcuno:

Usando il filtro non sarai in grado di passare un parametro ma ci sono almeno due cose che puoi fare.

1) Imposta i dati che vuoi filtrare in una variabile di ambito e fai riferimento che nella funzione di filtro come questo violino .

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:

 
  • O

    2) Crea un nuovo filtro che accetta un parametro come questo violino .

    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:

     
  • Nota che questo filtro presuppone che ci sia una proprietà di status negli oggetti nella matrice che potrebbe renderla meno riusabile, ma questo è solo un esempio. Puoi leggere questo per maggiori informazioni sulla creazione di filtri.

    Questa domanda è quasi identica a Passare argomenti a filtri angularjs , a cui ho già dato una risposta. Ma inserirò un’altra risposta qui solo perché la gente lo veda.

    In realtà esiste un’altra soluzione (forse migliore) in cui è ansible utilizzare il filtro ‘filtro’ nativo dell’angular e passare ancora argomenti al filtro personalizzato.

    Considera il seguente codice:

      
  • {{user.name}}
  • Per fare questo lavoro basta definire il filtro come segue:

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

    Questo approccio è più versatile perché puoi fare confronti su valori che sono annidati in profondità all’interno dell’object.

    Checkout Polarità inversa di un filtro angular.js per vedere come puoi usarlo per altre utili operazioni con filtro.

    Questo potrebbe essere leggermente irrilevante, ma se stai cercando di applicare più filtri con funzioni personalizzate, dovresti esaminare: https://github.com/tak215/angular-filter-manager

    Esempio Ho un elenco di studenti come di seguito:

     $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' } ]; 

    Voglio filtrare gli studenti in base al genere per essere ragazzo e filtrare per nome di loro.

    Il primo che creo una funzione chiamata “filterbyboy” come segue:

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

    Spiegazione: se non il nome del filtro mostra tutti gli altri filtri degli studenti per nome di inserimento e sesso come “ragazzo”

    Ecco un codice HTML completo e una demo Come utilizzare e operatore nell’esempio di AngularJs

    Se hai creato un filtro personalizzato AngularJs, puoi inviare più parametri al filtro. Qui è l’utilizzo nel modello

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

    e se si utilizza il filtro all’interno del controller, ecco come è ansible farlo

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

    se hai bisogno di più con esempi e demo online, puoi usare questo

    Esempi di filtri Angular e demo