Основы фильтра Angularjs

Question

Очень простой вопрос о настраиваемом фильтре. Я не понимаю, как объекты продуктов передаются фильтру как items или как фильтр имеет к ним доступ?

Я предполагаю, что это связано с <li ng-repeat="product in products | priceFilter:prices>, но четкое объяснение поможет как Google, и чтение документов angularjs пока не помогло.

JS файл

var myAppModule = angular.module('myApp', []); 

myAppModule.filter('priceFilter', function() { 
    return function(items, prices) { 
    console.log(items); 
    var filtered = [] 
    // Are all the brands active? 
    var allInActive = true; 
    for(var price in prices){ 
     if(prices[price].active){ 
     allInActive = false; 
     break; 
     } 
    } 
    if(allInActive){ 
     return items; 
    } 

    angular.forEach(items, function(item) { 

     if(item.price_desc != null){ 

     if(prices[item.price_desc].active){ 
      filtered.push(item); 
     }   
     } 
    }); 

    return filtered; 
    }; 
}); 

function ProductsController($scope, $filter) { 

    $scope.products = productsData; 
} 

HTML

<li ng-repeat="product in products | priceFilter:prices" ></li> 

Answer 1

Вы можете думать о | оператора Угловая аналогичным образом, как и в команде баш. | является трубопроводами результата выражения левого (в вашем случае products к правой стороне. Внизу, это просто хороший и удобный способ вызова фильтра из шаблона представления.

Когда |, коллекция, которая находится в левой части, отправляется в функцию фильтра до . фильтр. Фильтр всегда требует по крайней мере по параметру (фильтруемому массиву). Таким образом, Угловой безопасно, чтобы сделать предположение, что всегда будет что-то для фильтрации с левой стороны.

Это немного легче увидеть вызов основной функции с помощью синтаксиса $filter(name):

$filter('filter')(array, expression, comparator) 

'filter' выше этого имя фильтра, а затем, первый параметр array является источник массива, чтобы применить expression.

Таким образом, | - это просто удобный способ использования $filter без необходимости явно передавать параметр array.

Link to documentation here.