2016-11-23 43 views
-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 ] 
     } 
    })....... 

問題: 用戶登錄後,新的用戶界面視圖顯示了未經認證的頁面進行了短暫的觀點時間,然後加載經過身份驗證的內容。我怎樣才能避免這個問題?

+1

向我們展示您的路由器配置? – Sajeetharan

+0

使用ng-cloak和ui-view – Rishabh

+0

我會稍後分享這些路由。謝謝 – Aslam

回答

0

試圖改變這種

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

對此

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

ngCloak將阻止這種情況發生。

+0

我會檢查並通知你。謝謝 – Aslam

+0

不,它仍然是一樣的。 – Aslam