嵌套狀態UI路由器
[英]Nested states UI Router
問題描述
我正在努力讓嵌套狀態與UI路由器一起工作
我想要一個頁面來查看設備，以獲得像/device/SERIAL_NUMBER/info這樣的URL
-
/device是固定的 -
/SERIAL_NUMBER是變量aka:id -
/info指的是嵌套狀態
我有許多我想要的嵌套狀態，但為了簡單起見，我只顯示一個狀態。 請注意，對於info它與父視圖共享相同的控制器，而其他嵌套視圖則不共享。
狀態設置
.state('device', {
url: '/device/:id',
templateUrl: '/views/devices/device.html',
controller: 'viewDeviceController'
})
.state('device.info', {
url: 'info',
templateUrl: '/views/devices/device_info.html'
})
我的主要HTML看起來像這樣
<body>
<header><h1>Title</h1></header>
<div ui-view>
<!-- This is where /views/devices/device.html goes -->
</div>
/views/devices/device.html看起來像這樣：
<div>General text about a device</div>
<div ui-view>
<!-- This is where /views/devices/device_info.html should go -->
</div>
如果我導航到/#/device/L340009我看到主頁面和device.html ，我沒有看到device_info.html - 這是預期的，但理想情況下我希望默認是加載第一個路徑（info）
如果我導航到/#/device/L340009/info它會將我重定向到家（這是我的otherwise ），所以路線出了問題
我哪里錯了？
1 個解決方案
解決方案1
3 已采納 2015-10-16 14:21:36
這里的網址應以'/'開頭
.state('device.info', {
// instead of this
// url: 'info',
// we need this
url: '/info',
templateUrl: '/views/devices/device_info.html'
})
這將支持網址連接
'/#/device/L340009' + '/info'
is '/#/device/L340009/info'
ui-router - 嵌套狀態
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.