Question

我试图通过执行以下操作来实现一个可以监听状态更改事件的侦听器：

$rootScope.$on('$stateChangeStart', function (event) {
  if (!AuthenticationService.isLoggedIn()) {
    console.log('DENY');
    event.preventDefault();
    $state.go('login');
  }
  else {
    console.log('ALLOW');
    $state.go('/home');
  }
});

但是，这不会像上面提到的那样here，它已被弃用，transitions应该用来代替它们，所以我尝试了类似的东西：

$transitions.onStart({}, function() {
  if (!AuthenticationService.isLoggedIn()) {
    console.log('DENY');
    return $state.target('login');
  }
  else {
    console.log('ALLOW');
    return $state.target('home');
  }
});

这是一个错误：

app.js:21 Error: Too many Transition redirects (20+)
at Transition.run (app.js:18)
at app.js:21
at processQueue (app.js:10)
at app.js:10
at Scope.$eval (app.js:10)
at Scope.$digest (app.js:10)
at Scope.$apply (app.js:10)
at app.js:6
at Object.invoke (app.js:7)
at doBootstrap (app.js:6)StateService._defaultErrorHandler @ app.js:21

关于可能出错的任何想法？提前谢谢。

Answer 1

问题在于您通过执行

来强制更改状态

return $state.target('home')

这会导致另一个过渡到火，它会做出同样的决定并做另一个

return $state.target('home')

我认为你不应该在这里强迫一个州，只是让它继续下去：）

Answer 2

你可以这样做。没有经过测试，但应该可以使用。

app.run(function ($state,AuthenticationService, $rootScope) {
 $rootScope.$on('$stateChangeStart', function (event) {
  if (!AuthenticationService.isLoggedIn()) {
    console.log('DENY');
    event.preventDefault();
    $state.go('login');
  }
  else {
    console.log('ALLOW');
    $state.go('/home');
  }
});  
})

Answer 3

也许你忘了检查当前的状态而且你得到了

＆＃34;过多的转发重定向＆＃34;

尝试这样的事情：

$rootScope.$on('$stateChangeStart', function (event, toState, toParams) {
    if (!AuthenticationService.isLoggedIn()) {
        console.log('DENY');
        if (toState.name !== 'login') {
            event.preventDefault();
            $state.go('login');
        }
    } else {
        console.log('ALLOW');
        if (toState.name !== 'home') {
            event.preventDefault();
            $state.go('home');
        }
    }
});

AngularJs ui-router状态改变监听器

3 个答案: