Question

我遇到了$locationChangeStart事件多次触发的经典问题。我曾尝试使用preventDefault，但我似乎无法掌握这一点。

两个问题 - 第一个方案使用$location，第二个方案使用$state：

用户通过身份验证后，我会使用$state.go('main')进行重定向，但会再次触发$locationChangeStart。我不想要这种行为。
使用ui-router $stateChangeStart事件，我基本上遇到了infinite loop场景。这意味着，当此事件触发时，我会检查user authentication。如果用户未经过身份验证，我会使用$state.go('login');重定向。这会导致无限循环。

这是我的初学者app.js：

(function () {
    'use strict';
    angular.module('rage', [
       'ui.router',
       'ui.bootstrap',
       'ui.dashboard',
       'kendo.directives'       
    ]).run(['$rootScope', '$state',  '$location', 'userService', 'loginService', init]);

    function init($rootScope, $state, $location, userService, loginService) {
        $rootScope.rageSessionVars = {};
        $rootScope.$state = $state;        
        $rootScope.isLoggedin = false;   // just something to possibly use ???


        $rootScope.$on('$locationChangeStart', function () {

            var userToken = loginService.getUserCookie();

            // check if cookie expired, then authenticate user !
            if (userToken) {
                if (!loginService.isUserCookieExpired(userToken)) {
                    if (loginService.authUser(userToken)) {
                        $state.go('main');
                    }
                    else {                     
                        $location.url('index.html#/?login');    // not authenticated !
                    }
                }
            }
            else {
                $state.go('login');
                $location.url('index.html#/?login');
            }
        });

    }

})();

我昨天也为类似场景创建了一个plunker，只需修改app.js现在包含locationChangeStart事件。

在线搜索：http://plnkr.co/edit/hsSrPqFp0hpJ4A8cTsVL?p=preview

底线是我想要参与其中一个活动，以获得顺畅的用户登录/退出体验，但我总是对这些Angular事件感到困惑。

提前感谢您的专家提示。

的问候，鲍勃

Answer 1

在使用角度ui路由器时，使用$stateChangeStart和$stateChangeSuccess来控制状态更改期间的身份验证和手动路由等操作。

AngularJS中{locationChangeStart和$ stateChangeStart事件很难

1 个答案: