AngularJS - Come strutturare un filtro personalizzato con ng-repeat per restituire gli articoli in modo condizionale

Question

Ho una ng-repeat che stampa le voci dell'elenco. Voglio scrivere un filtro personalizzato in modo che la lista venga stampata, solo se una condizione è vera.

Mi sembra di avere la struttura sbagliata in quanto sembra che le variabili non vengano passate attraverso il filtro.

index.php

<div ng-show="userDetails.username" class="nav"> 
    <p>Menu</p> 
    <li ng-repeat="menuItem in menu | matchAccessLevel:$rootScope.userDetails.accessLevel:menuItem.minAccess | orderBy:'position' "> 
     <a ng-href="/angular-app/app/{{menuItem.id}}">{{menuItem.name}}</a> 
    </li> 
</div> 

app.js

userApp.filter('matchAccessLevel', function() { 
    return function(item, userAccessLevel, minAccessLevel) { 
     if(userAccessLevel >= minAccessLevel) { 
      return item; 
     } 
    } 
}); 

Answer 1

filtri non funzionano su singoli elementi della serie, che trasformano l'intera matrice in un'altra matrice.

userApp.filter('matchAccessLevel', function() { 
    return function(items, userAccessLevel) { 
    var filtered = []; 
    angular.forEach(items, function(item) { 
     if(userAccessLevel >= item.minAccess) { 
     filtered.push(item); 
     } 
    }); 
    return filtered; 
    }; 
}); 

Vai a questa plnkr

** sempre ispezionare gli argomenti a una funzione. Non è sempre evidente quali sono i valori *

vedere filters guide

Answer 2

Per gli amanti CoffeeScript:.

userApp.filter 'matchAccessLevel', -> 
    (items, userAccessLevel) -> 
    item for item in items when userAccessLevel >= item.minAccess 

Answer 3

È possibile utilizzare Array.filter per una soluzione più concisa:

app.filter('matchAccessLevel', function() { 
    return function(items, userAccessLevel) { 
     return items.filter(function(element){ 
     return userAccessLevel >= element.minAccess; 
     }); 
    } 
}); 

Check on Plunker