错误：Angular Ui路由器状态更改超出了最大调用堆栈大小 [英] Error: Maximum call stack size exceeded on Angular Ui Router State Change

问题描述

基本上我要做的是根据用户身份验证状态更改状态。

Basically what I'm trying to do is change the state depending on user authentication status.

当我执行 $ state.go（ ）; 没有$ rootScope，我可以重定向到没有错误的页面但是当我这样做时

When I do $state.go(); without $rootScope, I can redirect to the page without the error but when I do with

$ rootScope 。$ on（'$ stateChangeStart'，function（event）{
$ state.go（）;
event.preventDefault（）
}）

以下是控制器代码：

DiaryDashboard.controller('AppController', 
  ['$scope', '$rootScope', '$localStorage', '$http', '$state'
  , function ($scope, $rootScope, $localStorage, $http, $state) {

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

    if ($localStorage.userdetails &&
        $localStorage.userdetails.isAuthenticated == true) {

        //Check for Authentication state
        //If not redirect to the state in the else clause
        //Populate the $rootScope with user details
        $rootScope.userdetails = $localStorage.userdetails;

        //Switch to the parent state
        $state.go();
        event.preventDefault();

    } else {

        //If User not authenticated
        //GO to the Authentication State
        $state.go('auth');
        event.preventDefault();

    }
  })

}]);

推荐答案

这里最重要的是理解这一点： / p>

The most important thing here is to understand this:

如果不需要，请执行不重定向。换句话说，如果用户已经被重定向到预期状态 - 我们应该离开...有正在工作具有类似解决方案的plunker 。

Do not redirect if not needed. Other words, if user is already redirected to intended state - we should leave... There is a working plunker with similar solution.

检查此Q&答：

Check this Q & A:

调整后的代码：

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

    var isNavigatingToAuth = toState.name === "Auth";

    if(isNavigatingToAuth){

       return; // no need to redirect 
    }

    if ($localStorage.userdetails &&
        $localStorage.userdetails.isAuthenticated == true)
    ...

这篇关于错误：Angular Ui路由器状态更改超出了最大调用堆栈大小的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！