Javascript UI路由器：当您'；重新检查授权？

编辑：建议使用

resolve

的方法对我不起作用。

$stateChangeStart

事件似乎在解决问题之前发生

我使用（$stateChangeStart）对路由进行身份验证。在我这样做的过程中，出现了一个问题：如果用户试图访问一个未经授权的状态，该状态将在我的代码重定向他之前短暂显示

要解决这个问题，最好的方法似乎是使用

event.preventDefault（）

+

$state.go（toState.name，{}，{notify:false}）

，但是

{notify:false}

有一个

我不确定处理这种情况的好方法是什么。我唯一的想法是切换

body

的

display

属性，但我不喜欢这种解决方案

“闪烁”

显示：无

->

显示：块

在

主体

上

隐藏和重新显示DOM中如此大的一部分（或者它是吗？）代价很高

这种情况应该如何处理

angular
.module（'app'，['ui.router']））
.config（配置）
.跑（跑）
;
函数配置（$locationProvider、$urlRouterProvider、$stateProvider）{
$locationProvider.html5Mode（true）；
$urlRouterProvider。否则（'/'）；
$stateProvider
.州（“家”{
url:“/”，
模板：“home
”
})
.州（‘一’{
url:“/one”，
模板：“one
”，
验证：true
})
.州（“两个”{
url:“/two”，
模板：“两个”
})
;
}
函数运行（$rootScope、$state、$timeout）{
$rootScope.$on（“$stateChangeStart”，函数（事件、toState、toParams、fromState）{
if（toState.authenticate）{
//event.preventDefault（）；
元素（document.body）.css（'display'，'none'）；
如果（未验证（错误））{
//$state.go（toState.name，{}，{notify:false}）；
元素（document.body）.css（'display'，'block'）；
}
否则{
$timeout（函数（）{
$state.go（'two'）；
元素（document.body）.css（'display'，'block'）；
}, 2000);
}
}
});
}
函数已验证（硬代码）{
返回硬码；
}

家
第一州
国家二

如果您的

丢失了

防止事件会解决问题，并且不允许加载路由

function run($rootScope, $state, $timeout) {
  $rootScope.$on('$stateChangeStart', function(event, toState, toParams, fromState) {
    if (toState.authenticate) {
      if (!isAuthenticated()) {
        event.preventDefault();
        // can redirect if needed here
      }
    }
  });
}

function isAuthenticated() {
  return false; 
}

我希望它保持原样。当
isAuthenticated（）
返回
true
时，路线更改应通过。我知道
event.preventDefault（）
将导致路由更改无法通过。问题是我想调用
event.preventDefault（）
，然后在用户获得授权的情况下“反转它”。这是因为在我的真实应用程序中，我必须等待一些异步任务，然后才能知道它们是否被授权，而且我不希望页面在它们等待时显示，因此我希望在任务之前调用
event.preventDefault（）
，然后将其反转（如果被授权）。可以在父级状态下对所有身份验证路由使用解析，以获取用户数据并设置授权。如果父状态解析被拒绝，则将所有需要授权的路由置于一个父状态下，则无法访问任何子状态