服务未定义时，注入控制器

Question

我有一个控制器，我已经注入了一个工厂，但它返回时未定义，当我调用该工厂的方法。不知道我在这里做错了什么。任何帮助，将不胜感激。

厂：

(function(){ 
    'use strict'; 

    // Declare factory and add it 'HomeAutomation' namespace. 
    angular.module('HomeAutomation').factory('AuthenticationService', ['$http','$localStorage', '$window', function($http, $localStorage, $window){ 
    var service = {}; 


    service.login = Login; 
    service.logout = Logout; 
    service.parseJWT = parseJWT; 
    service.loginStatus = loginStatus; 

    return service; 


    function Login(email, password, callback){ 
     $http.post('api/user/login', {email: email, password: password}) 
      .success(function(res){ 
       // Login successful if there is a token in the response. 
       if(res.token){ 
        // store username and token in local storage to keep user logged in between page refreshes 
        $localStorage.currentUser = { email: email, token: res.token }; 

        // add jwt token to auth header for all requests made by the $http service 
        $http.defaults.headers.common.Authorization = 'Bearer ' + res.token; 

        callback(true); 
       }else{ 
        callback(res); 
       } 
      }).error(function(err){ 
      console.log(err); 
     }); 
    } 

    function Logout(){ 
     $localStorage.currrntUser 
    } 

    function parseJWT(token){ 
     var base64URL, base64; 

     base64URL = token.split('.')[1]; 
     base64 = base64URL.replace('-', '+').replace('_', '/'); 

     console.log(JSON.parse($window.atob(base64))); 
    } 

    function loginStatus(){ 
     if($localStorage.currentUser){ 
      return true; 
     }else{ 
      return false; 
     } 
    } 
}]);}()); 

控制器：

(function(){ 
angular.module('HomeAutomation') 
    .controller('loginController', ['$scope', '$location', 'AuthenticationService', function($scope, $location, $localStorage, AuthenticationService){ 
     $scope.isLoggedIn = AuthenticationService.logout(); 

     $scope.logUserIn = function(){ 
      AuthenticationService.login($scope.login.email, $scope.login.password, function(result){ 
       if(result === true){ 
        $location.path('/'); 
       }else{ 
        console.log(result); 
       } 
      }); 
     }; 

     $scope.logUserOut = function(){ 
      AuthenticationService.logOut(); 
     } 
    }]);}()); 

这是导致犯错行：

$scope.isLoggedIn = AuthenticationService.logout(); 

显然 “的AuthenticationService” 是不确定的。不知道为什么。

在此先感谢。

Answer 1

你搞砸了依赖顺序，你需要从控制器工厂功能中删除$localStorage，因为$localStorage没有用在控制器的任何地方&没有注入到DI数组中。

.controller('loginController', ['$scope', '$location', 'AuthenticationService', 
    function($scope, $location, AuthenticationService){ 
       //^^^^^^^^^^removed $localStorage dependency from here 

注：始终确保当你注入在DI阵列中的任何依赖，他们应该在同一个序列中使用的控制器功能

Answer 2

注射不好：

.controller('loginController', ['$scope', '$location', 'AuthenticationService', function($scope, $location, $localStorage, AuthenticationService){ 

试试这个：

.controller('loginController', ['$scope', '$location', '$localStorage', 'AuthenticationService', function($scope, $location, $localStorage, AuthenticationService){ 

我不知道你使用的建设者，但例如与Gulp，您可以使用gulp-ng-annotate，将做的工作给你，让你可以只写：

.controller('loginController', function($scope, $location, $localStorage, AuthenticationService){ 

没有数组。 ng-annotate将照顾其余。