Пользовательский фильтр AngularJS в шаблоне

Question

Во-первых - позвольте мне извиниться за то, что он является полным угловатым новичком.

В настоящее время я работаю над новым веб-приложение и пытается следовать стиль руководства (https://github.com/johnpapa/angular-styleguide)

У меня все работало, но в данный момент должен объявить свою функцию фильтра в каждом из моих контроллеров ,

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

Моя функция фильтра:

(function() { 
    'use strict'; 

    angular 
     .module('lfms') 
     .filter('includeDeleted', includeDeleted); 

    includeDeleted.$inject = ['property', 'includeDeleted']; 

    function includeDeleted(property, includeDeleted) { 
     if (includeDeleted) { 
      return function (item) { 
       return true; 
      } 
     } else { 
      return function (item) { 
       return !(item[property]); 
      } 
     } 
    } 
})(); 

, и я пытаюсь использовать его следующим образом:

<tr ng-repeat="crew_member_detail in vm.crew_members | filter: vm.includeDeleted('deletedAt', vm.showDeleted) | filter:vm.search | orderBy: predicate:reverse"> 

Если бы я включил эту функцию в моем контроллере (следующим образом) все работает отлично:

(function() { 
    'use strict'; 

    angular 
     .module('lfms') 
     .controller('CrewController', CrewController); 

    CrewController.$inject = ['CrewData', '$filter']; 

    function CrewController(CrewData, $filter) { 
     var vm = this; 
     vm.crew_members = CrewData(""); 
     vm.showDeleted = false; 
     vm.includeDeleted = includeDeleted; 

     function includeDeleted(property, includeDeleted) { 
      if (includeDeleted) { 
       return function (item) { 
        return true; 
       } 
      } else { 
       return function (item) { 
        return !(item[property]); 
       } 
      } 
     } 
    } 

})(); 

Я попытался удалить «vm.». перед фильтром, но все равно ничего. Я предполагаю, что это проблема, но, похоже, не может найти ничего, чтобы направлять меня к решению.

Я ценю любую помощь, которую вы можете дать!

Answer 1

Вы можете создать службу фильтра - см https://github.com/johnpapa/angular-styleguide#services:

(function() { 
    'use strict'; 

    angular 
     .module('app') 
     .service('filterSrv', filterSrv); 

    function filterSrv() { 
      this.includeDeleted = function(property, includeDeleted) { 
       if (includeDeleted) { 
        return function (item) { 
         return true; 
        } 
       } else { 
        return function (item) { 
         return !(item[property]); 
        } 
       } 
      } 
      // add more filter methods 
     } 

})(); 

Затем в контроллерах вводят свой filterService:

(function() { 
    'use strict'; 

    angular 
     .module('lfms') 
     .controller('CrewController', CrewController); 

    CrewController.$inject = ['$filter','CrewData', 'filterSrv']; 

    function CrewController($filter, CrewData, filterSrv) { 
     var vm = this; 
     vm.crew_members = CrewData(""); 
     vm.showDeleted = false; 
     vm.includeDeleted = filterSrv.includeDeleted; 


    } 

})();