Angularjs Angular ui router：如何延迟呈现模板，直到授权完成？

我的ui路由器配置如下：

$stateProvider
  .state('app', {
    url: '/app',
    abstract: true,
    templateUrl: 'sidemenu/sidemenu.html',
    controller: 'SideMenuCtrl'
  })
  .state('login', {
    url: '/login',
    templateUrl: 'login/login.html',
    controller: 'LoginCtrl'
  })
  .state('app.dashboard', {
    url: '/dashboard', 
    views: {
      menuContent: {
        templateUrl: 'dashboard/dashboard.html',
        controller: 'DashboardCtrl'
      }
    }
  })
  [More states here]

$urlRouterProvider.otherwise('/app/dashboard');

当用户导航到

/app/dashboard

时，我想检查他们是否被授权，然后：

• 如果未经授权，则重定向至

  /login

  ，或
• 如果授权，允许查看仪表板

这似乎奏效了：（基于）

此解决方案的唯一问题是，如果非授权用户导航到仪表板，仪表板模板首先可见。只有当授权响应返回时，它才会更改为登录模板

在我们授权用户时，是否有办法不显示仪表板

---

我还尝试将

$statechangesucture

更改为

$stateChangeStart

，但没有真正起作用（当时路由似乎完全中断）。

使用解析块怎么样

.state('app.dashboard', {
    url: '/dashboard', 
    views: {
        menuContent: {
            templateUrl: 'dashboard/dashboard.html',
            controller: 'DashboardCtrl',
            resolve: {
                login: function($q, Auth) {
                    var deferred = $q.defer();
                    Auth.getCurrentUser().then(function(currentUser) {
                        if (currentUser == null) {
                            deferred.reject();
                        } else {
                            deferred.resolve();
                        }
                    });
                    return deferred.promise;
                }
            }
        }
    }
})

---

在承诺得到解决之前，状态更改不会发生，因此模板不应显示。拒绝承诺将根据引发

$stateChangeError

，因此您需要处理该错误并重定向到登录页面。

您可以在路由上使用resolve，并在用户未登录时拒绝承诺，因此，永远无法联系到控制器。

如果每个页面都是大型应用程序，则无法为其调用服务器。我尝试使用$rootScope.username，但没有成功？有什么想法吗？

Auth.getCurrentUser（）

可以很容易地缓存用户数据（不过如果需要的话，需要在客户端实现超时）

.state('app.dashboard', {
    url: '/dashboard', 
    views: {
        menuContent: {
            templateUrl: 'dashboard/dashboard.html',
            controller: 'DashboardCtrl',
            resolve: {
                login: function($q, Auth) {
                    var deferred = $q.defer();
                    Auth.getCurrentUser().then(function(currentUser) {
                        if (currentUser == null) {
                            deferred.reject();
                        } else {
                            deferred.resolve();
                        }
                    });
                    return deferred.promise;
                }
            }
        }
    }
})