是否可以将登录功能及其模板与ng-view指令分开？

Question

我正在使用angular-ui-router构建一个AngularJS应用程序来处理我的路由。

我想知道是否可以完全从ng-view指令中分离登录功能和模板，因此在用户通过身份验证之前，我的其余布局都没有显示。

这是当前的设置：

关于如何做到这一点的任何想法？

提前致谢！

Answer 1

是的，使用Ui-Router声明创建一个不同的状态：

 .state('login', {
            url: '/login',
            controller: 'LoginController',
            templateUrl: 'app/views/login.html',
          })
 .state('stateNameIfLoggedIn', {
            url: '/dashboard',
            controller: 'DifferentController',
            templateUrl: 'app/views/differentTemplate.html',
            userLoggedIn: true
          })

在LoginController检查用户当前是否登录时，将他重定向到不同的状态：

//controller code starts
if(userLoggedIn === true){
  $state.go('stateNameIfLoggedIn')
}

Answer 2

事情是，在使用routeProvier显示带有模板+控制器的路径之前，您可以检查某些内容，然后控制路径。

'use strict'

intranet
.config ($routeProvider) ->
  $routeProvider
    .when '/page1',
      templateUrl: 'views/page1.html'
      controller: 'Page1Ctrl'
    .when '/page2',
      templateUrl: 'views/page2.html'
      controller: 'Page2Ctrl'
    .otherwise
        redirectTo: '/'
.run ($rootScope,Token,$location) ->
  $rootScope.$on '$locationChangeStart', ->
    Token.check()
    $rootScope.active_menu = $location.path()

我的令牌提供商检查令牌。

'use strict'
intranet
.provider 'Token', ->
  @$get = ($location,$http,$q,$rootScope) ->
    check: ()->
      if localStorage['access_token']
        $rootScope.loginMade = true
      else
        $rootScope.loginMade = false
        $location.path '/login'

这是我的节目索引，而不是内容。

 <header-app></header-app>
    <sidebar-app></sidebar-app>
    <!-- Add your site or application content here -->
      <div ng-view="" class="container" ng-class="{container_login : loginMade == false}">
      </div>
      <footer-app></footer-app>