角UI路由器 - 重定向不能在所有的工作 [英] Angular ui router - Redirection doesn't work at all
问题描述
我用 ui.router 在我的角度应用路由。有一个典型的登录情况，在那里我重定向用户登录URL，如果他没有登录。如果没有ui.router库，这正常工作使用$ routeChangeStart事件与 $ location.path结合。现在，我使用了 $ stateChangeStart 事件，以 $ state.go 相结合，并没有什么作品！它也将我的浏览器变成一个无限循环。我从其他来源看，这是一个已知的bug，并没有建议的解决方案，为我工作。此外， $ location.path 太不重定向到登录页面。
这是我是如何配置我的路径：
的.config（['$ stateProvider'，'$ urlRouterProvider'，函数（$ stateProvider，$ urlRouterProvider）{
$ stateProvider
.STATE（'主'，{
网址：'/'，
templateUrl：意见/ main.html中，
控制器：'MainCtrl
}）
.STATE（'约'，{
网址：'/约，
templateUrl：意见/ about.html'，
控制器：'AboutCtrl
}）
.STATE（'登陆'，{
网址：'/登录'，
templateUrl：意见/ loginform.html'，
控制器：'LoginCtrl
}）;
$ urlRouterProvider.otherwise（/）;
}]）
和我的运行方法：
.RUN（['$状态，$ rootScope'，'$位置'，函数（$状态，$ rootScope，$位置）{
//检查路由启动时
//事件，接下来，当前
$ rootScope。在$（'$ stateChangeStart'功能（即toState，toParams，fromState，fromParams）{
//重定向到登录，如果用户没有登录
如果（！isUserLoggedIn）{ //几点建议
//e.$p$pventDefault（）;
的console.log（'未登录'）; //无限循环，杀死我的浏览器！
$ state.go（'登录'）;
$ state.transitionTo（'登录'）; //几点建议
$ state.go（登录，网址：{url：/登录'}）; //不工作
$ location.path（'/登录'）; // $ location.path（$ state.href（'密码'）;
的console.log（'重定向'）;
}
}）;
我们需要在这里什么，是做不定向，如果该国已经登录。
只是一个起草的调整将是
$ rootScope。在（'$ stateChangeStart'$，功能（即toState，toParams
，fromState，fromParams）{ VAR isLogin = toState.name ===登录; 如果（isLogin）{ 返回; //没有必要再重定向
}
...
而且，我们应该叫 $ state.go（'登录'）; 与事件preventDefault（）;
...
//还美元重定向p $ pvent默认
$ state.go（'登录'）;
。事件preventDefault（）;
...
请检查该问答集一个如何解决超过最大调用堆栈大小AngularJS
和一个plunker ，有着相近的解决方案
I'm using ui.router for routing in my Angular app. There is a typical login scenario, where I'm redirecting a user to the login url if he's not logged in. Without the ui.router library, this worked fine using $routeChangeStart event combined with $location.path. Now, I'm using the $stateChangeStart event, combined with $state.go, and the nothing works! It also sends my browser into an infinite loop. I read from other sources that this is a known bug, and none of the suggested solutions work for me. Moreover, $location.path too doesn't redirect to the login page.
This is how I've configured my paths:
.config(['$stateProvider', '$urlRouterProvider', function ($stateProvider, $urlRouterProvider) {
$stateProvider
.state('main', {
url: '/',
templateUrl: 'views/main.html',
controller: 'MainCtrl'
})
.state('about', {
url: '/about',
templateUrl: 'views/about.html',
controller: 'AboutCtrl'
})
.state('login', {
url: '/login',
templateUrl: 'views/loginform.html',
controller: 'LoginCtrl'
});
$urlRouterProvider.otherwise("/");
}])
And my run method:
.run(['$state', '$rootScope', '$location', function($state, $rootScope, $location) {
//Check when routing starts
//event, next, current
$rootScope.$on( '$stateChangeStart', function(e, toState, toParams, fromState, fromParams) {
//Redirect to login if the user is not logged in
if (!isUserLoggedIn) {
//Some suggestion
//e.preventDefault();
console.log('Not logged in');
//Infinite loop, kills my browser!
$state.go('login');
$state.transitionTo('login');
//Some suggestion
$state.go('login', { url: '/login'});
//Doesn't work
$location.path('/login');
//$location.path( $state.href('login');
console.log('Redirected');
}
});
What we would need here, is to do NOT redirect, if the state TO is already the 'login'.
Just a drafted adjustment would be
$rootScope.$on( '$stateChangeStart', function(e, toState , toParams
, fromState, fromParams) {
var isLogin = toState.name === "login";
if(isLogin){
return; // no need to redirect anymore
}
...
And also, we should call $state.go('login'); with the event.preventDefault();
...
// also prevent default on redirect
$state.go('login');
event.preventDefault();
...
Please check this Q & A How can I fix 'Maximum call stack size exceeded' AngularJS And a plunker with similiar solution
这篇关于角UI路由器 - 重定向不能在所有的工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
