嵌套状态UI路由器

问题描述:

我挣扎着爬与UI路由器工作嵌套状态嵌套状态UI路由器

我想一个页面来查看的设备是有像/device/SERIAL_NUMBER/info一个网址,

  • /device是固定
  • /SERIAL_NUMBER是可变又名: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 - 这是预期,但最好我想默认为加载第一路线(信息)

如果我浏览到/#/device/L340009/info它将我重定向回家(这是我的otherwise),所以路由有些问题

我在哪里出错了?

这里的网址应该以 '/'

.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' 
+0

我觉得自己很蠢开始 - 那工作!如果没有指定'info'作为默认路由,我该如何获取? – Chris

+0

对不起,对此不完全确定“如果没有指定信息,我如何获取信息作为默认路由?”我不完全明白。如果提供了错误的状态,你是否在问如何进行默认重定向?如果是的话,我们可以使用'$ urlRouterProvider.otherwise('/ home');' - 检查这个plunker http://plnkr.co/edit/4pjoofCXq444kjXLqGx8?p=info –

+0

我已经有了一个其他的*路线,我的意思是,如果有人去'/设备/ XXXXX'我怎么让他们自动去'/设备/ XXXXX /信息' – Chris