Angularjs错误:null不是对象(评估“a.$current.local [l]”)

I have an angular project set up that when a user goes to /cloud and they aren't logged in (isLoggedIn() return fails), it redirect to /login. And then if they are logged in and go to /login it redirects them back to /cloud.

我设置了一个有棱角的项目，当用户进入/cloud并且没有登录(isLoggedIn() return失败)时，它会重定向到/login。然后如果他们登录进入/登录，它会将他们重定向回/cloud。

However, when I click the logout button to clear the local storage, I get the following error (everything still works):

但是，当我点击logout按钮清除本地存储时，会出现以下错误(一切正常):

Error: null is not an object (evaluating 'a.$current.locals[l]')

错误:null不是对象(评估“a.$current.local [l]”)

According to my logs, it appears to be happening on the onEnter for my logout controller.

根据我的日志，在我注销控制器的onEnter上，它似乎正在发生。

I'm new to angular so any advice or guidance would be greatly appreciated.

我是新手，所以任何建议或指导都会非常感谢。

var routerApp = angular.module('myapp', ['ui.router'])
    //config for state changes
    .factory('Auth', function($http, $state, $q) {

        var factory = { isLoggedIn: isLoggedIn };
        return factory;

        function isLoggedIn(token) {
            return $http.post('/auth/session', {token:token});
        }

    })
    .config(function($stateProvider, $urlRouterProvider, $locationProvider) {

        $locationProvider.html5Mode(true);
        $urlRouterProvider.otherwise('/cloud');

        var authenticated = ['$q', 'Auth', '$rootScope', function ($q, Auth, $rootScope) { 
            var deferred = $q.defer();
            if (typeof window.localStorage['authtoken'] === 'undefined') {
                var authtoken = undefined;
            } else {
                var authtoken = window.localStorage['authtoken'];
            }
            Auth.isLoggedIn(authtoken).then(function() {
                deferred.resolve();
            }, function() {
                deferred.reject();
            });
            return deferred.promise;
        }];

        var authGuest = ['$q', 'Auth', '$rootScope', function ($q, Auth, $rootScope) { 
            var deferred = $q.defer();
            if (typeof window.localStorage['authtoken'] === 'undefined') {
                var authtoken = undefined;
            } else {
                var authtoken = window.localStorage['authtoken'];
            }
            Auth.isLoggedIn(authtoken).then(function() {
                deferred.reject();
            }, function() {
                deferred.resolve();
            });
            return deferred.promise;
        }];

        $stateProvider

            .state('login', {
                url: '/login',
                templateUrl: 'pages/templates/login.html',
                resolve: { authenticated: authGuest }
            })

            .state('logout', { url: '/logout', onEnter: function($state) { localStorage.clear(); $state.go('login'); } })

            .state('cloud', {
                url: '/cloud',
                templateUrl: 'pages/templates/cloud.html',
                resolve: { authenticated: authenticated }
            })

    })
    .run(function ($rootScope, $state) {
        $rootScope.$on('$stateChangeError', function (event, from, error) {
            if(from.name == "login") {
                $state.go('cloud');
            } else {
                $state.go('login');
            }
        });
    });

1 个解决方案

#1

The problem seems to be here:

问题似乎在这里:

    var authenticated = ['$q', 'Auth', '$rootScope', function ($q, Auth, $rootScope) { 
        var deferred = $q.defer();
        if (typeof window.localStorage['authtoken'] === 'undefined') {
            var authtoken = undefined;
        } else {
            var authtoken = window.localStorage['authtoken'];
        }
        Auth.isLoggedIn(authtoken).then(function() {
            deferred.resolve();
        }, function() {
            deferred.reject();
        });
        return deferred.promise;
    }];

This function will only run once on Configuration. The promise, once resolved, will continue to resolve to same value regardless of LocalStorage. Every time you

这个函数只在配置上运行一次。一旦解决了这个问题，不管LocalStorage是什么，它都将继续解析相同的值。每一次你

resolve: { authenticated: authenticated }

You will get back the authenticated value at Configuration step.

您将在配置步骤中获得已验证值。

instead, add a controller to define functions to request status for each type

相反，添加一个控制器来定义为每种类型请求状态的函数。

  .controller('AuthenticationController', function($scope, '$q', Auth, '$rootScope') {
        $scope.authenticated = function () { 
            var deferred = $q.defer();
            if (typeof window.localStorage['authtoken'] === 'undefined') {
                var authtoken = undefined;
            } else {
                var authtoken = window.localStorage['authtoken'];
            }
            Auth.isLoggedIn(authtoken).then(function() {
                deferred.resolve();
            }, function() {
                deferred.reject();
            });
            return deferred.promise;
        };

        $scope.authGuest = function ($scope, '$q', Auth, '$rootScope') { 
            ....
            return deferred.promise;
        };

    });

Then, in your routing configurations:

然后，在您的路由配置中:

        .state('login', {
            url: '/login',
            templateUrl: 'pages/templates/login.html',
            controller: 'AuthenticationController'
            resolve: { authenticated: $scope.authGuest() }
        })
        .state('cloud', {
            url: '/cloud',
            templateUrl: 'pages/templates/cloud.html',
            resolve: { authenticated: $scope.authenticated()}
        })

Now, each time you be resolving a fresh promise.

现在，每次你解决一个新的承诺。

Disclaimer: Without a working version to use, I formed this code for demonstration purposes. It should be treated a pseudo-code to lead in right direction.

免责声明:在没有可用版本的情况下，我为演示目的编写了此代码。它应该被当作伪代码来引导正确的方向。