$ state.go超时$ stateChangeStart

时间:2015-12-11 23:41:41

标签: angularjs angular-ui-router

我目前正在尝试检查用户是否在状态发生变化时进行了身份验证。在我的跑步区里,我正在收听$stateChangeStart事件。在下面的代码中,我现在可以让控制台记录podio is authenticatedpodio is not authenticated,但是当我将$state.go添加到catch语句中时,它会无限加载然后超时。我已经尝试添加' event.preventDefault`,因为它说here,但我不完全理解为什么这样做是必要的。

运行阻止

    $rootScope.$on('$stateChangeStart', function (event) {

            ...

            Podio.podio.isAuthenticated()
                .then(function () {
                    console.log('podio is authenticated');
                })
                .catch(function(error) {
                    console.log('podio is not authenticated');
                    event.preventDefault();
                    $state.go('login'); //when this is added it continues to load...
                });
            ...

    });

我确定它不是州定义,因为它们一直都在正常工作。

州定义

$stateProvider
                // setup an abstract state for the tabs directive
                .state('tab', {...})    
                .state('tab.events', {...})
                .state('tab.event-detail',{...})
                .state('tab.attendees',{...})
                .state('tab.attendee-detail',{...})
                .state('login', {
                    url: '/login',
                    templateUrl: 'views/login.html',
                    controller: 'LoginController'
                });

1 个答案:

答案 0 :(得分:1)

您对每个isAuthenticated运行stateChangeStart检查。如果此检查失败,您最终会在catch块中导航到某个州。这会在验证失败时再次触发stateChangeStart

您可以向login州添加一些标记,以允许未经身份验证的用户访问:

.state('login', {
  url: '/login',
  requireAuthentication: false,
  templateUrl: 'views/login.html',
  controller: 'LoginController'
})

稍后再查看:

$rootScope.$on('$stateChangeStart', function (event, toState) {
  ...
  if(!toState.hasOwnProperty('requireAuthentication') || toState.requireAuthentication !== false)
    Podio.podio.isAuthenticated()
  ...
}