UI-路由器不会从URL中获得正确的状态
UI-路由器不会从URL中获得正确的状态
提问于 2016-05-25 22:57:48
我有一个有点复杂的设置，有很多嵌套的选项卡/视图。下面是我的$stateProvider的相关部分
$stateProvider
.state('tab', {
abstract: true,
url: '',
templateUrl: 'tabs.html'
})
.state('tab.event', {
url: '/event',
views: {
'event': {
abstract: true,
templateUrl: 'event-tabs.html'
}
}
})
.state('tab.event.list', {
url: '/list',
views: {
'list': {
templateUrl: 'event-list.html'
}
}
})
.state('tab.event.detail', {
cache: false,
url: '/:id',
views: {
'detail': {
abstract: true,
templateUrl: 'event-detail-tabs.html'
}
}
})
.state('tab.event.detail.info', {
cache: false,
url: '/info',
views: {
'info': {
templateUrl: 'event-detail-info.html'
}
}
})
.state('tab.event.detail.map', {
cache: false,
url: '/map',
views: {
'map': {
templateUrl: 'event-detail-map.html'
}
}
});- 使用
ui-sref="tab.event.detail({id: event.id})"我可以链接到tab.event.detail.info状态，并且URL更改为/event/:id/info，good。 - 如果我输入URL
/event/:id，它将重定向到/event/:id/info，good。 - BUT如果我输入URL
/event/:id/info，状态将变为tab.event.list，URL变为/event/list，not good。
我希望能够共享到/event/:id/info和/event/:id/map的链接，但它们一直重定向到/event/list
尝试了很多方法，但都不能正常工作，请帮帮忙！
编辑:制作了一个柱塞示例，但我不能复制这个问题，因为我不能直接操作应用程序的URL。https://plnkr.co/edit/7iZAH26SwAILqBfkdXJS?p=preview
回答 2
Stack Overflow用户
回答已采纳
发布于 2016-07-28 02:04:07
在定义完所有状态后，您可以尝试使用以下命令：
$urlRouterProvider
.when('/event/:id/info', '/event/:id/info')
.when('/event/:id/map', '/event/:id/map')或者你也可以试试
var config = ['$rootScope', '$state',
function ($rootScope, $state) {
//you can make the below code better by comparing URL you are hitting in the if condition. Depending on URL you can navigate to info or map state. Also, you can make the id dynamic
$rootScope.$on('$stateChangeStart', function (event, toState) {
if (toState.name == "tab.event.list") {
event.preventDefault()
$state.go('tab.event.detail.info', {id: 2});
}
});
}]Stack Overflow用户
发布于 2016-05-25 23:14:11
您的"tab.event.detail"状态是一个抽象状态，这意味着该状态本身不能被自身激活，因此它将自动加载子状态，在本例中为"tab.event.detail.info"状态。
记住：一次只能激活一个状态。
请参阅文档https://github.com/angular-ui/ui-router/wiki/Nested-States-%26-Nested-Views
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/37440870
复制相关文章
相似问题