gpt4 book ai didi

javascript - 在 resolve() 抛出错误后重定向到模板时出现 Angular UI Router 问题

转载 作者:塔克拉玛干 更新时间:2023-11-02 23:04:26 27 4
gpt4 key购买 nike

所以我花了很长时间才理解这个问题并得到一个 mcve .情况是这样的:我试图在用户未通过身份验证时将其重定向到登录页面(这是非常基本的)。这是代码:

HTML:

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.6/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.13/angular-ui-router.min.js"></script>
<script src="js/app.js"></script>
</head>
<body ng-app="starter">

<div ui-view></div>

<script id="login.html" type="text/ng-template">
l
</script>

<script id="welcome.html" type="text/ng-template">
w
</script>
</body>
</html>

JS:

    angular.module('starter', ['ui.router'])

.run(["$rootScope", "$state", function($rootScope, $state) {
$rootScope.$on("$stateChangeError", function(event, toState, toParams, fromState, fromParams, error) {
if (error === "nope") {
$state.go("login");
}
});
}])

.config(function($stateProvider, $urlRouterProvider) {
$urlRouterProvider.otherwise('/welcome');

$stateProvider
.state('welcome', {
url: '/welcome',
templateUrl: 'welcome.html',
resolve: {
"auth": ["$q", function($q) {
return $q.reject("nope");
}]
}
})

.state('login', {
url: '/login',
templateUrl: 'views/login.html'
})
});

“views/login.html”仅包含“vl”以便在屏幕上看到它。所以,当上面的代码运行时,输出是好的,但是看看 Chrome 控制台:

crazy error

现在,最疯狂的部分是,如果您修改 JS 并替换

templateUrl: 'views/login.html'

简单的在登录状态下

templateUrl: 'login.html'

使用 html 中定义的 ng-template,一切都很好!那么好吧,我想使用文件作为模板必须触发一些观察者或其他什么......好吧,不,我只是没有想法。

在此先感谢您的帮助!

[编辑]

这里有两件事可以提供帮助:

  • 使用 ngRoute 代替 UI Router 没有报错
  • 将Angular版本替换为1.2.25不会报错

所以我认为这是 UI Router 和 Angular 1.3 的错误。但是完全不知道如何解决它。

最佳答案

您需要调用event.preventDefault()在你打电话之前 $state.go() .

参见此处:http://plnkr.co/edit/eUosIpdN7adJFxfDo3kV?p=preview

正如您已经确定的那样,发生此错误的主要原因是模板 url 'views/login.html'不存在。你说当你从 'views/login.html' 更改模板 url 时至 'login.html'一切正常,这是有道理的,因为该模板确实存在。

您看到无限摘要错误的原因是每次您尝试访问 welcome说明 auth解析器抛出触发 $stateChangeError 的错误就像您期望的那样。一切都很好,直到它尝试转到 login 为止。状态。正在尝试过渡到 login状态失败,因为模板 url 'views/login.html'不存在,此故障导致您的 otherwise重定向带你回到 welcome状态。此时您可以看到返回到 welcome。状态将重新启动整个循环并导致无限摘要循环。

正如您已经发现的那样,只需确保您的模板 url 正确就可以防止这种情况发生。

关于javascript - 在 resolve() 抛出错误后重定向到模板时出现 Angular UI Router 问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27710247/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com