未知提供者錯誤AngularJs

Question

試用我的手在angularjs授權使用POST。我的代碼還包含從此延遲加載POST

代碼在嚮應用程序注入「權限」工廠時遇到問題。我的根目錄下面

app.js：

(function() 
{ 
    var myApp = angular.module('myApp',['ngRoute']); 
    var roleId = 5; 
    var permissionList = {}; 

    myApp.config(function($routeProvider, $controllerProvider, $filterProvider, $provide, $compileProvider, $httpProvider) 
     { 
      myApp.controllerProvider = $controllerProvider; 
      myApp.compileProvider = $compileProvider; 
      myApp.routeProvider  = $routeProvider; 
      myApp.filterProvider  = $filterProvider; 
      myApp.provide   = $provide; 

      $httpProvider.responseInterceptors.push('securityInterceptor'); 

      $routeProvider 
       .when('/', { 
        templateUrl:'app/login/login.html', 
        resolve:{ 
         deps: function($q, $rootScope) { 
          var deferred = $q.defer(); 
          // Add dependencies here 
          var dependencies = 
           [ 

            'app/services/services.js', 
            'app/directives/directives.js', 
            'app/login/login.js', 

           ]; 

          $script(dependencies, function() 
          { 
           // all dependencies have now been loaded by $script.js so resolve the promise 
           $rootScope.$apply(function() 
           { 
            deferred.resolve(); 
           }); 
          }); 

          return deferred.promise; 
         } 
        }, 
        permission: 'login' 
       }); 
     }); 

    myApp.provider('securityInterceptor', function() { 
     this.$get = function($location, $q) { 
      return function(promise) { 
       return promise.then(null, function(response) { 
        if(response.status === 403 || response.status === 401) { 
         $location.path('partials/unauthorized'); 
        } 
        return $q.reject(response); 
       }); 
      }; 
     }; 
    }); 

    // Get User Roles and Permissions from server 
    angular.element(document).ready(function() { 
     $.get('b1.0/../api/index/user-roles', function(data) { 
      userRoles = data; 
     }); 

     $.post('b1.0/../api/index/user-permissions', {roleId:roleId}, function(data) { 
      permissionList = data; 
     }); 
    }); 

    myApp.run(function(permissions) { 
     permissions.setPermissions(permissionList) 
    }); 

    // Tried this but still not working 
    /*myApp.run(['permissions', function(permissions){ 
     permissions.setPermissions(permissionList); 
    }]);*/ 

})(); 

appBootstrap.js：

$script(['app/app.js'], function() 
{ 
    angular.bootstrap(document, ['myApp']); 
}); 

appMain.js：

var myApp = angular.module('myApp'); 

myApp.controller('mainAppCtrl', function($scope, $location, permissions) { 
    $scope.$on('$routeChangeStart', function(scope, next, current) { 
     var permission = next.$$route.permission; 
     if(_.isString(permission) && !permissions.hasPermission(permission)) 
      $location.path('/unauthorized'); 
    }); 
}); 

services.js ：

angular.module('myApp') 
    .factory('permissions', function ($rootScope) { 
     var permissionList; 
     return { 
      setPermissions: function(permissions) { 
       permissionList = permissions; 
       $rootScope.$broadcast('permissionsChanged') 
      }, 
      hasPermission: function (permission) { 
       permission = permission.trim(); 
       return _.some(permissionList, function(item) { 
        if(_.isString(item.Name)) 
         return item.Name.trim() === permission 
       }); 
      } 
     }; 
    }); 

directives.js：

angular.module('myApp').directive('hasPermission', function(permissions) { 
    return { 
     link: function(scope, element, attrs) { 
      if(!_.isString(attrs.hasPermission)) 
       throw "hasPermission value must be a string"; 

      var value = attrs.hasPermission.trim(); 
      var notPermissionFlag = value[0] === '!'; 
      if(notPermissionFlag) { 
       value = value.slice(1).trim(); 
      } 

      function toggleVisibilityBasedOnPermission() { 
       var hasPermission = permissions.hasPermission(value); 

       if(hasPermission && !notPermissionFlag || !hasPermission && notPermissionFlag) 
        element.show(); 
       else 
        element.hide(); 
      } 
      toggleVisibilityBasedOnPermission(); 
      scope.$on('permissionsChanged', toggleVisibilityBasedOnPermission); 
     } 
    }; 
}); 

Here是我上傳的文件。

我得到的錯誤是這樣

http://errors.angularjs.org/1.2.13/ $噴油器/ unpr？P0 = permissionsProvider％20％3 C-％20permissions

誰能告訴我是怎麼回事錯在這裏??

更新1：一次宣佈對myApp通過@Chandermani的建議後，現在有這個錯誤太

http://errors.angularjs.org/1.2.13/ $噴油器/ NOMOD P0 = MyApp來

Answer 1

Refrence所有的索引文件。html的你只參照

<script type="text/javascript" rel="javascript" src="app/vendor/jquery-2.1.0.min.js"></script> 
<script type="text/javascript" rel="javascript" src="app/vendor/angular.min.js"></script> 
<script type="text/javascript" rel="javascript" src="app/vendor/angular-route.js"></script> 
<script type="text/javascript" rel="javascript" src="app/script.js"></script> 
<script type="text/javascript" rel="javascript" src="app/appBootstrap.js"></script> 
<script type="text/javascript" rel="javascript" src="app/appMain.js"></script> 

角模塊化的依賴性不包括在運行時的文件，它只是解決例如，如果你想解決您應該使用的東西在運行時的文件，比如Require.js

---

注意：不要把ng-view上的HTML body標籤本身，創造身體內一個div並把ng-view就可以了，因爲把它放在身體會塗掉一切的index.html頁面上

Answer 2

我看到的myApp申報？兩次

app.js

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

個

appMain.js：

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

這將重新創建的模塊。所以，第二個應該是

var myApp = angular.module('myApp');