角度ui视图无法正确加载

-1

我正在研究基于Angular 1和ui-router的应用程序。下面是我的索引页的代码角度ui视图无法正确加载

<div ng-if="!authenticated"> 
     <div ui-view></div> 
    </div> 

    <div ng-if="authenticated"> 
     <!-- header start --> 
     <div header></div> 
     <!-- header end --> 
     <div class="wrapper" id="wrapper"> 
      <!-- sidebar start --> 
      <div sidebar></div> 
      <!-- sidebar end --> 
      <div class="content"> 
       <div class="container-fluid"> 
        <div ui-view></div> 
       </div> 
      </div> 
     </div> 
     <!-- footer start --> 
     <div footer></div> 
     <!-- footer end --> 
    </div>

路由器Congif：

$stateProvider 
    .state(CONSTANTS.STATE.LOGIN, { 

     url: CONSTANTS.PAGE_URL.LOGIN, 
     templateUrl: "./resources/login/login.tpl.html", 
     controller: 'LoginCtrl', 
     data: { pageTitle: 'Title for Login'}, 
     permit : { 
      loginRequired: false, 
      resources : [ PERMISSIONS.RESOURCES.ALL ] 
     } 
    }).state('abc', { 
      abstract: true, 
      url: CONSTANTS.PAGE_URL.BASE, 
      controller: 'AbcCtrl', 
      templateUrl: "./resources/abc/base/abc.tpl.html" 
    }).state('abc.dashboard', { 

     url: CONSTANTS.PAGE_URL.DASHBOARD, 
     templateUrl: "./resources/abc/dashboard/dashboard.tpl.html", 
     data: { pageTitle: 'Title for Dashboard' }, 
     controller: 'DashboardCtrl', 
     permit : { 
      loginRequired : true, 
      resources : [ PERMISSIONS.RESOURCES.ALL ] 
     } 
    }).......

问题：用户登录后，新的用户界面视图显示了未经认证的页面进行了短暂的观点时间，然后加载经过身份验证的内容。我怎样才能避免这个问题？

来源

2016-11-23 Aslam

向我们展示您的路由器配置？ – Sajeetharan

使用ng-cloak和ui-view – Rishabh

我会稍后分享这些路由。谢谢 – Aslam

试图改变这种

<div ng-if="!authenticated"> 
     <div ui-view></div> 
</div>

对此

<div ng-if="!authenticated" ng-cloak> 
     <div ui-view></div> 
</div>

ngCloak将阻止这种情况发生。

来源

2016-11-23 12:05:52

我会检查并通知你。谢谢 – Aslam

不，它仍然是一样的。 – Aslam

角度ui视图无法正确加载

回答

相关问题