注入控制器时服务未定义

时间:2016-09-16 15:10:53

标签: javascript angularjs dependency-injection angularjs-controller angularjs-factory

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

厂:

(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"未定义。不知道为什么。

提前致谢。

2 个答案:

答案 0 :(得分:2)

你搞砸了依赖序列,你需要从控制器工厂函数中删除$localStorage,因为$localStorage在控制器和放大器的任何地方都没有用。没有注入DI阵列。

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

注意:始终确保在DI数组中注入任何依赖项时,它们应该在控制器函数中以相同的顺序使用

答案 1 :(得分:0)

注射效果不佳:

.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将负责其余部分。