Ошибка: $ Инжектор: unpr Неизвестный Provider в AngularJS

Question

Я пытаюсь сделать тест приложение на AngularJS, но застрял на несколько дней на одном месте с этой ошибкой:

angular.js:38 Uncaught Error: [$injector:unpr] http://errors.angularjs.org/1.4.1/$injector/unpr?p0=AuthtokenProvider%20%3C…terceptor%20%3C-%20%24http%20%3C-%20%24templateRequest%20%3C-%20%24compile 

как я мог понять, я сделал ошибка где-то в ссылках:

вы можете показать мне, где мой код ниже

mainController.js:

angular.module('mainController', []) 

.controller('MainController', function($rootScope, $location, Auth) { 

     var vm = this; 

     vm.LoggedIn = Auth.isLoggedIn(); 

     $rootScope.$on('$routeChangeStart', function() { 
      vm.LoggedIn = Auth.isLoggedIn(); 

      Auth.getUser() 
       .then(function (data) { 
        vm.user = data.data; 
       }); 
     }); 

     vm.doLogin = function() { 

      vm.processing = true; 

      vm.error = ''; 

      Auth.login(vm.loginData.username, vm.loginData.password) 
       .success(function (data) { 
        vm.processing = false; 

        Auth.getUser() 
         .then(function (data) { 
          vm.user = data.data; 
         }); 

        if (data.success) 
         $location.path('/'); 
        else 
         vm.error = data.message; 

       }); 
     } 

     vm.doLogout = function() { 
      Auth.logout(); 
      $location.path('/logout'); 
     } 
    }); 

userController.js:

angular.module('userController', ['userService']) 

.controller('UserController', function(User){ 

    var vm = this; 

    User.all() 
     .success(function (data) { 
      vm.users = data 
     }) 
}) 

.controller('UserCreateController', function(User, $location, $window){ 

     var vm = this; 

     vm.signupUser = function() { 
      vm.message = ''; 

      User.create(vm.userData) 
       .then(function(response){ 
        vm.userData = {}; 
        vm.message = response.data.message; 

        $window.localStorage.setItem('token', response.data.token); 
        $location.path('/'); 
       }) 
     } 
    }) 

authService.js:

angular.module('authService', []) 

.factory('Auth', function($http, $q, AuthToken) { 

     var authFactory = {}; 

     authFactory.login = function(username, password){ 

      return $http.post('/api/login', { 

       username: username, 
       password: password 
      }) 
       .success(function(data){ 
        AuthToken.setToken(data.token); 
        return data; 
       }) 
     } 

     authFactory.logout = function(){ 
      AuthToken.setToken(); 
     } 

     authFactory.isLoggedIn = function(){ 
      if(AuthToken.getToken()) 
       return true; 
      else 
       return false; 
     } 

     authFactory.getUser = function(){ 
      if(AuthToken.getToken()) 
      return $http.get('/api/me'); 
      else 
      return $q.reject({ message: "User has no token"}); 
     } 

     return authFactory; 
    }) 

.factory('AuthToken', function($window){ 

     var authTokenFactory = {}; 

     authTokenFactory.getToken = function(){ 
      return $window.localStorage.getItem('token'); 
     } 

     authTokenFactory.setToken = function (token) { 
      if(token) 
      $window.localStorage.setItem('token', token); 
      else 
      $window.localStorage.removeItem('token'); 
     } 

     return authTokenFactory; 
    }) 

.factory('AuthInterceptor', function ($q, $location, Authtoken) { 

     var interceptorFactory = {}; 

     interceptorFactory.request = function(config){ 

      var token = Authtoken.getToken(); 

      if(token){ 
       config.headers['x-access-token'] = token; 
      } 

      return config 
     }; 

     interceptorFactory.responseError = function (response) { 
      if(response.status == 403) 
      $location.path('/login'); 

      return $q.reject(response); 
     } 

     return interceptorFactory; 
    }); 

userService.js:

angular.module('userService', []) 

.factory('User', function($http){ 

     var userFactory = {}; 

     userFactory.create = function(userData){ 
      return $http.post('/api/signup', userData); 
     } 

     userFactory.all = function(){ 
      return $http.get('/api/users'); 
     } 

     return userFactory; 
    }); 

app.js:

angular.module('MyApp', ['appRoutes', 'mainController', 'authService', 'userController', 'userService']) 

.config(function($httpProvider){ 

     $httpProvider.interceptors.push('AuthInterceptor'); 
    }); 

app.routes. js:

angular.module('appRoutes', ['ngRoute']) 

.config(function ($routeProvider, $locationProvider) { 

     $routeProvider 

      .when('/', { 
       templateUrl: 'app/views/pages/home.html' 
      }) 
      .when('/login',{ 
       templateUrl: 'app/views/pages/login.html' 
      }) 
      .when('/signup', { 
       templateUrl: 'app/views/pages/signup.html' 
      }); 

     //$locationProvider.html5Mode(true); 
     $locationProvider.html5Mode({ 
      enabled: true, 
      requireBase: false 
     }); 
    }); 

Answer 1

Вы должны вводить свой authService в свой mainController, чтобы сделать его доступным, так как вы используете Auth в mainController:

angular.module('mainController', ['authService']); 

Everytime вы проходите во 2-й аргумент модуля (массив) создает новый модуль, который не имеет доступа к другим созданным модулям. Поэтому вы должны сделать их доступными друг другу таким образом.

Вы можете прочитать о

Answer 2

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

Example с форумом.