angularjs - AngularJs UI-Router 具有并排视图的嵌套状态

Question

我有一个使用 ui-router 的 AngularJS 项目，我们在其中设置了一个具有两个并排视图的状态：

$stateProvider
    .state('side-by-side', {url: '/side-by-side', views: {
        'listView': { templateUrl: 'list.html', controller: 'ListView' },
        'detailView': { templateUrl: 'detail.html', controller: 'DetailController'}
    }});

现在，我的 detail.html 文件还包含一个名为“detailPage”的 ui-view 项，我希望将其填充到并排的嵌套状态中，称之为 side-by-side.item。我不太确定该怎么做。我尝试了以下方法：

.state('side-by-side.item', {url: /side-by-side/{itemId}/{pageId}, views: {
    'detailPage@detailView': {templateUrl: 'detailPage.html', controller: 'PageController'}
}});

但这似乎不起作用。有什么线索吗？

提前谢谢了，

约瑟夫。

Answer 1

您可以尝试以下方法之一吗

.state('side-by-side.item', {url: /side-by-side/{itemId}/{pageId}, views: {
    'detailPage@side-by-side.item': {templateUrl: 'detailPage.html', controller: 'PageController'}
}});

或者

.state('side-by-side.item', {url: /side-by-side/{itemId}/{pageId}, views: {
    'detailPage@side-by-side': {templateUrl: 'detailPage.html', controller: 'PageController'}
}});