请考虑以下事项:
.state('manager.staffList', {url:'^/staff?alpha', templateUrl: 'views/staff.list.html', data:{activeMenu: 'staff'}, controller: 'staffListCtrl'})
.state('manager.staffDetail', {url:'^/staff/{id}' , templateUrl: 'views/staff.html', data:{activeMenu: 'staff'}, controller: 'staffDetailsCtrl'})
.state('manager.staffDetail.view', {url:'/view', templateUrl: 'views/staff.details.html', data:{activeMenu: 'staff'}})
.state('manager.staffDetail.view.schedule', {url:'/schedule', templateUrl:'views/staff.view.schedule.html', data:{activeMenu: 'staff'}})
.state('manager.staffDetail.view.history', {url:'/history' , templateUrl:'views/staff.view.history.html', data:{activeMenu: 'staff'}})
.state('manager.staffDetail.view.log', {url:'/log', templateUrl:'views/staff.view.log.html', data:{activeMenu: 'staff'}})
.state('manager.staffDetail.view.files', {url:'/files', templateUrl:'views/staff.view.files.html', data:{activeMenu: 'staff'}})
.state('manager.staffDetail.edit', {url:'/edit', templateUrl: 'views/staff.edit.html', data:{activeMenu: 'staff'}})
如果转到example.com/staff/1234/view
,如何默认为manager.staffDetail.view.schedule
子状态?
9条答案
按热度按时间yruzcnhs1#
1.首先,向**
abstract:true
的'manager.staffDetail.view'
状态添加一个属性。这不是必需的,但您希望设置此属性,因为您不会直接转到此状态,您将始终转到它的一个子状态。1.然后执行以下**操作之一:
'manager.staffDetail.view.schedule'
状态指定一个空URL。这将使它与其父状态URL匹配,因为它不会向父URL追加任何内容。module.config
中设置一个redirect,这里的代码将把'/staff/{id}/view'
的任何位置重定向到'/staff/{id}/view/schedule'
的位置:uidvcgyl2#
要设置默认子视图,请选中此example。单击
Route 1
时加载默认状态route1.list
xoefb8l83#
我遇到了同样的问题,并发现这个解决方案的工作:
https://github.com/angular-ui/ui-router/issues/948#issuecomment-75342784
这是引用自github上的@christopherthielen
现在,不要声明您得状态为抽象状态,而使用以下方法:
以下是该流程的工作原理:
1.用户导航至“父代”状态
1.触发“$stateChangeStart”事件
1.“$stateChangeStart”的侦听器捕获事件并将“toState”(即“parent”)和“event”传递给处理函数
1.处理程序函数检查“toState”上是否设置了“redirectTo”。
1.如果未设置“redirectTo”,则不会发生任何事情,用户继续进入“toState”状态。
1.如果设置了“redirectTo”,则会取消该事件(event.preventDefault),并且$state.go(toState.redirectTo)会将它们发送到“redirectTo”中指定的状态(即“parent.child”)。
1.“$stateChangeStart”事件再次触发,但这一次“toState”==“parent.child”并且未设置“redirectTo”选项,因此它继续为“toState”。
z9ju0rcb4#
很晚了,但我认为你可以“重定向”到你想要的状态。
您可以直接在状态配置中编写控制器。
f45qwnt85#
我将“manager.staffDetial.view”更改为抽象状态,并将默认子状态的url保留为空白“”
zpgglvta6#
在“angular-ui-router”中:“0.2.13”,我不认为@nfiniteloop的重定向解决方案将工作。它工作,一旦我已经回滚到0.2.12(可能不得不把$urlRouterProvider.when调用之前的$stateProvider?)
请参阅https://stackoverflow.com/a/26285671/1098564
和https://stackoverflow.com/a/27131114/1098564(如果您不想返回到0.2.12)以获得解决方法
截至2014年11月28日,https://github.com/angular-ui/ui-router/issues/1584表示它应在0.2.14中再次工作
p4rjhz4m7#
这是最新版本的angular-ui-router for AngularJS,在 * 那个 * 版本(特别是@uirouter/angularjs#v1.0.x)中,你可以把
redirectTo: 'childStateName'
放在$stateProvider.state()
的第二个参数中,例如:下面是相关的文档部分:https://ui-router.github.io/guide/ng1/migrate-to-1_0#state-hook-redirectto
希望这能帮助到一些人!
z4iuyo4d8#
这里是通过仅修改UI路由器中的父状态的非常简单和透明的替换:
j0pj023g9#
添加angular-ui-router-default,并将
abstract
和default
选项添加到父状态:...
...
注意:要使其正常工作,父模板中的某个位置必须有
<ui-view/>
。