角度指示命令のロードオーダー：コントローラーで使用したときの不明なプロバイダー

Question

コントローラーnavCtrlを使用して、ヘッダーHTMLに指示文click-anywhere-but-hereを使用しようとしています。角度はエラーを投げている：

Unknown provider: clickAnywhereButHereProvider <-

私は、これは私はJSファイルを連結しgulpを使用していますどのように関係していると思っています。私は連結されたmain.jsファイルをすべてのJSとチェックし、navCtrlがclickAnywhereButHere指令の上に定義されていることを確認してください。コントローラーが指令をまったく使用していないため、この問題が起きた場合は、header.htmlファイルのみが問題であるかどうかは不明です。

<header ng-controller="navCtrl"> 
    <a click-anywhere-but-here="clickedSomewhereElse()" ng-click="clickedHere()"> 
    <li>study</li> 
    </a> 
</header> 

どのように私はclickAnywhereButHereディレクティブが文句を前にロードされるまで待つようにヘッダを強制することができますか？

---

編集：コード：

navCtrl.js：私は関係のない多くのコードを全焼しました

angular 
    .module('DDE') 
    .controller('navCtrl', ['$rootScope', '$location', '$scope', 'Modal', 'Auth', '$window', '$state', 'deviceDetector', 
     function($rootScope, $location, $scope, Modal, Auth, $window, $state, deviceDetector) { 

      $scope.clicked = ''; 
      $scope.clickedHere = function(){ 
       $scope.clicked = 'stop that'; 
       console.log('clicked on element'); 
      }; 
      $scope.clickedSomewhereElse = function(){ 
       console.log('clicked elsewhere'); 
       $scope.clicked = 'thanks'; 
      }; 

      $scope.headings = [ 
       {page: 'contact', route: '#/contact'} 
      ]; 
     } 
    ]); 

clickAnywhereButHere.jsディレクティブ：

angular.module('DDE') 
.directive('clickAnywhereButHere', function($document, clickAnywhereButHereService){ 
    return { 
     restrict: 'A', 
     link: function(scope, elem, attr, ctrl) { 
      var handler = function(e) { 
       e.stopPropagation(); 
      }; 
      elem.on('click', handler); 

      scope.$on('$destroy', function(){ 
       elem.off('click', handler); 
      }); 

      clickAnywhereButHereService(scope, attr.clickAnywhereButHere); 
     } 
    }; 
}); 

clickAnywhereButHereService.jsサービス：

angular.module('DDE') 
.factory('clickAnywhereButHereService', function($document){ 
    var tracker = []; 

    return function($scope, expr) { 
     var i, t, len; 
     for(i = 0, len = tracker.length; i < len; i++) { 
      t = tracker[i]; 
      if(t.expr === expr && t.scope === $scope) { 
       return t; 
      } 
     } 
     var handler = function() { 
      $scope.$apply(expr); 
     }; 

     $document.on('click', handler); 

     // IMPORTANT! Tear down this event handler when the scope is destroyed. 
     $scope.$on('$destroy', function(){ 
      $document.off('click', handler); 
     }); 

     t = { scope: $scope, expr: expr }; 
     tracker.push(t); 
     return t; 
    }; 
}); 

ディレクティブとサービスの両方が私のminファイル内に存在している：あなたは、アカウントにそのyour JS is minified事実を取る必要があり

Answer 1

。

だから、これはこの

.directive('clickAnywhereButHere', 
    ['$document', 'clickAnywhereButHereService', 
    function($document, clickAnywhereButHereService){ 
    //... 
    }])