AngularJS UI路由器嵌套視圖無法加載內容

我看了無數如何設置它的例子。在這裏許多人就在這裏。但在我的情況下沒有任何工作。這是一個非常簡單的兩個視圖，其中一個嵌套在第一個視圖之下。第二UI視從未加載...AngularJS UI路由器嵌套視圖無法加載內容

這裏是簡單index.html ...

<body ng-app="d6Games"> 
    <div ui-view="home"></div> 
</body>

這裏是單純的孩子看來，這是裏面home.html模板...

<div class="d6body bilbo"> 
    <div ui-view="content"></div> 
</div>

這裏是簡單的狀態...

.state('home', { 
    url: '/home', 
    views: { 
     'home': { 
      templateUrl: '/views/home.html' 
     } 
    } 
}) 

.state('home.intro', { 
    url: '/intro', 
    views: { 
     'content': { 
      templateUrl: '/views/game-intro.html' 
     } 
    } 
})

第一個/views/home.html模板加載正常，但預計未加載子節點/views/game-intro.html。它只是html和文本，與home.html位於同一個文件夾中。

我錯過了什麼？

來源

2015-04-12 Locohost

有a working plunker

我只是改變了模板路徑（去除領先「/」），和所有工作（然而，這是需要plunker，不知道你的環境和路徑設置）：

$stateProvider 
    .state('home', { 
    url: '/home', 
    views: { 
     'home': { 
     templateUrl: 'views/home.html' 
     } 
    } 
    }) 

    .state('home.intro', { 
    url: '/intro', 
    views: { 
     'content': { 
     templateUrl: 'views/game-intro.html' 
     } 
    } 
    }) 
}

檢查行動here

來源

2015-04-12 18:12:41

好了，越來越近。我像你一樣添加了ui-sref鏈接到index.html。當你點擊它們時，它們確實會起作用。遊戲-intro.html按預期加載。但是，爲什麼不在頁面加載時自動加載，而無需點擊home.intro鏈接？ – Locohost

不知道你是什麼意思，但我加了這行'$ urlRouterProvider.otherwise（'/ home/intro'）;'你可以檢查這個分叉的plunker，它正在工作http://plnkr.co/edit/Vg3fmypcepEgkA8c40ju ？p =預覽..介紹開始工作。如果你想要設置一些** child **狀態爲默認（而不是它的父級），你應該檢查這些鏈接：http://stackoverflow.com/a/29579343/1679310和http：// stackoverflow。 com/q/29491079/1679310 –

是的，工作。這讓我在那裏。謝謝Radim！ – Locohost

AngularJS UI路由器嵌套視圖無法加載內容

回答

相關問題