Error: Maximum call stack size exceeded on Angular Ui Router State Change(错误:Angular Ui 路由器状态更改时超出了最大调用堆栈大小)
问题描述
基本上我要做的是根据用户身份验证状态更改状态.
Basically what I'm trying to do is change the state depending on user authentication status.
当我在没有 $rootScope 的情况下执行 $state.go();
时,我可以在没有错误的情况下重定向到页面,但是当我使用
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();
}
})
}]);
推荐答案
这里最重要的是要明白这一点:
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.
查看此问答答:
调整后的代码:
$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 路由器状态更改时超出了最大调用堆栈大小的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
本文标题为:错误:Angular Ui 路由器状态更改时超出了最大调用堆栈大小
基础教程推荐
- 如何使用JIT在顺风css中使用布局变体? 2022-01-01
- Chart.js 在线性图表上拖动点 2022-01-01
- 直接将值设置为滑块 2022-01-01
- 自定义 XMLHttpRequest.prototype.open 2022-01-01
- 用于 Twitter 小部件宽度的 HTML/CSS 2022-01-01
- html表格如何通过更改悬停边框来突出显示列? 2022-01-01
- 如何使用TypeScrip将固定承诺数组中的项设置为可选 2022-01-01
- Vue 3 – <过渡>渲染不能动画的非元素根节点 2022-01-01
- Electron 将 Node.js 和 Chromium 上下文结合起来意味着 2022-01-01
- 我可以在浏览器中与Babel一起使用ES模块,而不捆绑我的代码吗? 2022-01-01