app---
a---
a.index.html
b---
b.index.html
b.index.html
<a ui-sref="a.index">show a.index.html</a>
<p ui-view></p>
How to make the ui-view
p display a.index.html?
ui-view
Where does it read by default? Where is ui-view
controlled?
And the ui-sref
compiled a
tag does not have the href
attribute
angular.module("mainApp")
.config(function ($stateProvider, $urlRouterProvider) {
$stateProvider
.state("a", {
url: '/a',
templateUrl: 'app/a/a.html'
})
.state("b", {
url: '/b',
templateUrl: 'app/b/b.html'
})
app/index.html:
....
<p ui-view></p>
....
ui-router is through the position of state
進(jìn)行頁(yè)面跳轉(zhuǎn)控制的,具體來(lái)說(shuō),當(dāng)一個(gè)頁(yè)面加載了ui-router
及其相關(guān)router
配置后(上面的示例代碼),會(huì)跟據(jù)地址欄的url加載對(duì)應(yīng)的模板,比如上文,如果訪問(wèn)了/a
這個(gè)路徑,ui-router會(huì)知道這個(gè)/a
路徑對(duì)應(yīng)a
這個(gè)state
,他的模板是app/a/a.html
,之后就會(huì)加載這個(gè)模板,并把它塞到ui-view
這個(gè)directive
(this may not be very appropriate, because state can be inherited and views can also be nested, which is a far stretch)
It is recommended to take a good look at the ui-router wiki