0

當前正在使用AngularJS UI路由的應用程序中工作。在因特網上搜索我的問題幾個小時後,我仍然無法理解我的問題將如何解決。這是我正在使用的代碼。如果任何人都可以幫到這個。然後我會非常感激。另一個UI視圖中的角度ui視圖

我只是想知道代碼如何爲ui-view =「sidebar」定義狀態,就像我在defaultLayout狀態中定義了頁眉和頁腳一樣。嘗試了一些東西,但沒有工作。任何想法請分享。

HTML:

//====index.html=====// 
<body ui-view="layout"></body> 

//========default.html (nested view inside layout)=============// 
<header ui-view="header"></header> 
<div class="wrap"> 
    <div id="container"> 
     <div ui-view="alert"></div> 
     <div ui-view></div> 
    </div> 
</div> 
<footer ui-view="footer"></footer> 


//=======products.html (another nested view inside empty ui-view in default.html file)========// 
<div class="row"><div ui-view="sidebar"></div></div> 

JS代碼:

//=====states I have defined in my route files are=====// 
$stateProvider. 
     state('defaultLayout', { 
      abstract: true, 
      views: { 
       'layout': { 
        templateUrl: 'views/layouts/default.html' 
       }, 
       '[email protected]': { 
        templateUrl: 'views/elements/header.html', 
        controller: 'HeaderCtrl' 
       }, 
       '[email protected]': { 
        templateUrl: 'views/elements/footer.html', 
        controller: 'FooterCtrl' 
       }, 
       '[email protected]': { 
        templateUrl: 'views/elements/sidebar.html', 
        controller: 'SidebarCtrl' 
       }, 
       '[email protected]': { 
        templateUrl: 'views/layouts/alert.html', 
        controller: 'AlertCtrl' 
       } 
      } 
     }) 
     .state('home', { 
      url: '/', 
      templateUrl: 'views/pages/home.html', 
      controller: 'HomeCtrl', 
      parent: 'defaultLayout' 
     }) 
     .state('checkout', { 
      url: '/pages/checkout', 
      templateUrl: 'views/pages/checkout.html', 
      controller: 'HomeCtrl', 
      parent: 'defaultLayout' 
     }); 
+0

這裏非常糟糕。任何人都可以請幫忙!!!! –

回答

0

點表示法

可以使用點語法來推斷層次的$ stateProvider。在下面,contacts.list成爲聯繫人的孩子。

$stateProvider 
    .state('contacts', {}) 
    .state('contacts.list', {}); 
+0

感謝您的意見。我嘗試了相同的方法,但不知何故它不工作。你可以分享任何示例代碼,如果你有你,從我可以參考的地方。或者你可以幫助我分享上述更新的代碼,如果可以的話。 再次感謝。 –

相關問題