Как в AngularJS создать кастомный фильтр с зависимостями?

Question

[Иван Феофанов]

Добрый день.

Несколько часов бьюсь над проблемой, причина которой, скорее всего, мое слабое знание AngularJS. Как говорится, все пальцы в кровь сгуглил, а решения не нашёл.

Надо создать кастомный фильтр, который отбраковывал бы все, что входит в заданный массив. Массив доступен в $scope, фильтр в отдельном файле addIngrFilter.js

Вот код файла с фильтром:

angular
	.module('quApp')
	.filter('addIngrFilter', ['$scope', function($scope) {
		return function (items){
			var filtered = [];
			items.forEach(function(item){
				if($scope.dishIngredientsIndexes.indexOf(item.id)<0){
					filtered.push(item);
				}
			});
			return filtered;
		};
	}]);

Однако, Angular ругается, говорит Error: [$injector:unpr] и шлёт по адресу: https://docs.angularjs.org/error/$injector/unpr?p0...

Что я делаю не так?

Answer 1

[Иван Феофанов]

Решил! Итоговый код фильтра выглядит так:

angular
	.module('quApp')
	.filter('ingrListFilter', function() {
		return function (items, filter){
			return _.reject(items, function(item){
				return _.contains(filter, item.id);
			});
		};
	});

А вызов фильтра так:

<span ng-repeat="ingredient in ingredients | ingrListFilter:dishIngredientsIndexes">
    <span class="badge">{{ingredient.name}}</span>
</span>

dishIngredientIndexes - это массив, которым надо отфильтровать исходные данные.

Answer 2

[Павел Кононенко]

$scope доступен только внутри контроллеров и link-функций директив. И фильтр должен быть не жестко завязан на какую-то переменную. Вы должны ее передавать в фильтр. Если я правильно понял, то нужно так:

.filter('addIngrFilter', [function() {
    return function (items, item){
      var filtered = [];
      items.forEach(function(items){
        if(items.indexOf(item.id)<0){
          filtered.push(item);
        }
      });
      return filtered;
    };
  }]);

<div>{{dishIngredientsIndexes | item_for_exclude}}</div>

А вообще, познакомьтесь с Underscore.js

Comments

[Иван Феофанов]

Огромное вам человеческое спасибо за совет и отдельно за Underscore, раньше я про неё не знал. Теперь не понимаю, как я мог раньше без неё кодить.

[Павел Кононенко]

Иван Феофанов: если с серверным языком программирования еще не определились, то берите ruby с фреймворком Ruby on Rails. Underscore был вдохновлен именно с ruby)

[Иван Феофанов]

Павел Кононенко: руби мне очень нравится, но сейчас я над node.js корплю. Конкретно вот этот проект в sails.js делается. Очень похоже на rails, кстати. А с Underscore так вообще как ничего не поменялось, только фигурных скобочек больше стало 8)