AngularJS - как структурировать пользовательский фильтр с помощью ng-repeat для условного возврата элементов

у меня есть ng-repeat, который печатает элементы списка. Я хочу написать пользовательский фильтр, чтобы элемент списка печатался, только если условие истинно.

Кажется, у меня неправильная структура, поскольку кажется, что переменные не проходят через фильтр.

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

приложение.js

userApp.filter('matchAccessLevel', function() {
    return function( item, userAccessLevel, minAccessLevel ) {
        if( userAccessLevel >= minAccessLevel ) {
            return item;
        }
    }
});
3 58
angularjs angularjs-ng-repeat angular-filters

3 ответа:

фильтры не работают на отдельных элементах массива, они преобразуют весь массив в другой массив.

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

посмотреть этот plnkr

* * всегда проверяйте аргументы функции. Не всегда очевидно, что это за ценности.*

посмотреть руководство по фильтрам

124

вы можете использовать массив.фильтр для более краткого решения:

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

проверяем на Plunker

6

для любителей CoffeeScript:

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