在 Angular ui-router 重定向到另一个页面之前，如何避免在几分之一秒内显示一个页面？答案

【问题标题】：How can I avoid showing a page for a fraction of a second before angular ui-router redirects to another page?在 Angular ui-router 重定向到另一个页面之前，如何避免在几分之一秒内显示一个页面？
【发布时间】：2015-12-12 21:04:44
【问题描述】：

我在我的网站上使用 angular ui-router 进行路由，使用 ng-token-auth 进行身份验证。如果登录用户尝试访问登录页面，则应将其重定向到主页（代码如下）。

$stateProvider
.state('sign-in',{
    url: '/sign-in',
    templateUrl: 'partials/registrations/sign-in.html',
    controller: 'SigninCtrl as signin',
    resolve: {
      auth: function($auth, $state) {
        $auth.validateUser().then(function(){
          $state.go('home');
        });
      }
    }
  })

这适用于状态更改或刷新页面时。但是，当我在新选项卡上打开登录链接时，它会在几分之一秒内显示登录页面，然后重定向到主页。

如何避免在重定向之前显示登录页面视图？

【问题讨论】：

标签： angularjs angular-ui-router state resolve

【解决方案1】：

$stateProvider
.state('sign-in',{
    url: '/sign-in',
    templateUrl: 'partials/registrations/sign-in.html',
    controller: 'SigninCtrl as signin',
    resolve: {
      auth: function($auth, $state, $timeout) {
        var promise = $auth.validateUser();
        promise.then(function(){
          $timeout(function() {
             $state.go('home');
          });
        });
        return promise;
      }
    }
  })

【讨论】：

【解决方案2】：

您可以使用 状态更改事件 - stateChangeStart 。

$stateChangeStart - 转换开始时触发。

angular.module('MyApp').run(function($rootScope, $state) {
    // Check authentication before changing state
    $rootScope.$on('$stateChangeStart', function(event, toState, toParams, fromState, fromParams) {
        // do authentication work here
    });
});

【讨论】：