Невозможно впрыскивать фильтры в контроллер для AngularJS

Question

Привет, я только что начал работу на угловом. Я использую AngularJS 1.2.4. Всякий раз, когда я пытаюсь внедрить фильтр в мой контроллер я получаю следующее сообщение об ошибке:

Error: error:unpr Unknown Provider Unknown provider: senderReceiverDetailInfoProvider <- senderReceiverDetailInfo <- senderReceiverFilter

Вот мои app.js:

var myApp = angular.module("myapp", []); 

Вот мои myFilter.js:

myApp.filter('senderReceiver',function(senderReceiverDetailInfo,index){ 
       conole.log("i",index); 
      if(senderReceiverDetailInfo.description != ''){ 
        return true; 
      }else{ 
        return false; 
      } 
    }); 

Это мой контроллер.js

 myApp.controller("myCtrl",'$scope','$http','PaymentService','senderReceiverFilter', 
    function($scope,$http,PaymentService,senderReceiverFilter){ 
      $scope.sendReceiveFilter = senderReceiverFilter; 
    }]); 

И наконец вот мой index.html, в котором я пытаюсь использовать фильтр:

<div ng-repeat="detailInfo in senderReceiverDetail | filter : sendReceiveFilter"> 
    <label>{{$index + 1}}.</label><label>Type : {{detailInfo.lineType}}</label>&nbsp;&nbsp; 
    <label>Description : {{detailInfo.description}}</label> 
    </div>     
          </div>  

И, наконец, вот мои вопросы: 1) Почему инъекции не работает? 2) Я использую правильно введенный фильтр (предположим, что он как-то правильно введен) в моем index.html? 3) Также я правильно определил фильтры или мне нужно объявить их в отдельном модуле? Если я объявляю их в отдельном модуле, то как их вводить? . если я следующий вместо того, что я делаю сейчас для объявления фильтра:

angular.module('myfilters',[]).filter('senderReceiver',function(senderReceiverDetailInfo,index){ 
       conole.log("i",index); 
      if(senderReceiverDetailInfo.description != ''){ 
        return true; 
      }else{ 
        return false; 
      } 
    }); 

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

 angular.module('myapp',['myfilters']); 

Тогда как использовать/впрыснуть фильтр, определенный в модуле «myfilters» в контроллере, который я определил в модуле «myapp»?

4) И, наконец, что является лучшим aproach? объявление фильтров в полностью spearate-модуле или определение его на основном модуле, таком как контроллер и службы?

Я знаю, что я мало осведомлен об инъекции зависимостей, кроме основного синтаксиса. Но я думаю, это то, что мне нужно. Благодарю.

Answer 1

Вот как я это делаю. Я украл фильтр от AngularJS filter documentation.

var MyApp = angular.module('myapp',[]); 

MyApp.filter('reverse', function() { 
    return function(input, uppercase) { 

     input = input || ''; 
     var out = ""; 

     for (var i = 0; i < input.length; i++) { 
      out = input.charAt(i) + out; 
     } 

     if (uppercase) { 
      out = out.toUpperCase(); 
     } 

     return out; 
    }; 
}); 

Теперь вы сможете использовать фильтр в шаблонах так: {{ myObject.value | reverse }}

Answer 2

Фильтр, который вы используете с нг-повтора в этот фильтр https://code.angularjs.org/1.2.15/docs/api/ng/filter/filter

Функция фильтра должна быть определены в области, просто попробуйте:

$scope.sendReceiveFilter = function(senderReceiverDetailInfo,index){ 
       conole.log("i",index); 
      if(senderReceiverDetailInfo.description != ''){ 
        return true; 
      }else{ 
        return false; 
      } 
    } 

Обновление: Чтобы создать свою собственную функцию фильтрации для фильтрации массива, вам необходимо определить, чтобы сделать что-то вроде

myApp.filter('senderReceiver', function() { 
    function (senderReceivers, index) { 
     var filteredsenderReceivers = []; 
     // Fill the above array with filtered values from senderReceivers array 
     return filteredsenderReceivers 
    } 
}); 

senderReceivers является массивом

использовать фильтр в качестве <div ng-repeat="detailInfo in senderReceiverDetail |sendReceive">

Answer 3

ошибка, вы получаете, потому что вы не определения фильтра правильно. Фильтр должен вернуть функцию. Так обновить фильтр:

myApp.filter('senderReceiver', function(){ 
    return function(senderReceiverDetailInfo,index){ 
     console.log("i",index); 
     if(senderReceiverDetailInfo.description != ''){ 
      return true; 
     }else{ 
      return false; 
     } 
    };  
}); 

так, как вы объявили о фильтровальные Угловая поверить, что вы искали зависимостей названных senderReceiverDetailInfo и info. Поскольку они не определены как Угловые активы, Angular будет вызывать ошибку, жалуясь на то, что не может найти поставщика для именованного актива в вашем случае senderReceiverDetailInfoProvider, что и соответствует журналам.

В случае, если вы хотите использовать фильтр в контроллере, вы можете вводить $filter service, а затем просто позвонить:

$filter('senderReceiver')(senderReceiverDetailInfo,index); 

Чтобы ответить на ваш последний вопрос, вы должны поместить все связанные активы (будь то контроллер, сервис или фильтр) в том же модуле.