gpt4 book ai didi

javascript - 为什么 Angular 重定向到路线但加载错误的 View

转载 作者:行者123 更新时间:2023-11-30 08:01:32 25 4
gpt4 key购买 nike

我有一个基本需求,我想用路线来解决:

  1. 定义了一堆路由
  2. 如果用户未通过身份验证,则他将被重定向到登录页面

我的问题是,第一次显示网络应用程序时,用户似乎被正确重定向,因为URI 是正确的,但显示的 View 不是(它对应于默认 View )。

I've created a jsbin为此,如果您更愿意亲眼看到它。 result can be viewed here .

重现步骤:

  1. 加载页面
  2. 您会看到 needsAuth,这意味着即使 URI 包含 login(对应于 View 登录)
  3. 重新加载页面
  4. 你看到'login',意思就是查看login
  5. 的内容

HTML代码:

<!DOCTYPE html>
<html ng-app='app'>
<head>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular-route.js"></script>
<meta charset="utf-8">
<title>JS Bin</title>
</head>
<body>
<div ng-view>
</div>
</body>
</html>

这是javascript代码:

var template = '{{vm.text}}';

angular
.module('app', ['ngRoute'])
.config(['$routeProvider', routes])
.controller('needsAuthController', needsAuthController)
.controller('loginController', loginController)
.run(['$rootScope', '$location', registerRedirection]);

function routes($routeProvider){
$routeProvider
.when('/needsAuth', {
controller: 'needsAuthController',
controllerAs: 'vm',
template: template
})
.when('/login', {
controller: 'loginController',
controllerAs: 'vm',
template: template
})
.otherwise({
redirectTo: '/needsAuth'
});
}

function needsAuthController(){
var vm = this;

vm.text = 'needsAuth';
}

function loginController(){
var vm = this;

vm.text = 'login';
}

function registerRedirection($rootScope, $location){
$rootScope.$on('$routeChangeStart', function(event, next){
$location.path('/login');
});
}

在第一次加载时,可以看到 URI 和内容不匹配 Result on first load

如果我重新加载页面,一切都会按预期工作: Result after reloading the page

我做错了什么吗?如果是这样,在某些情况下重定向用户的正确方法是什么?

[编辑]:Angular 1.2.26 似乎在这种情况下表现正确,但 angular 1.3.2 则不然

最佳答案

改变

function registerRedirection($rootScope, $location){
$rootScope.$on('$routeChangeStart', function(event, next){
$location.path('/login');
});
}

function registerRedirection($rootScope, $location){
$rootScope.$on('$locationChangeStart', function(event, next){

^ change this ^

$location.path('/login');
});
}

然后您的初始加载工作正常。

关于javascript - 为什么 Angular 重定向到路线但加载错误的 View ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26910791/

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