Question

我们有一些延迟加载模块和路由器配置如下：

{
    path: 'parent',
    component: Parent,
    children: [
        {
            path: child1,
            loadChildren: 'pathToModule1'
        }
        {
            path: child2,
            loadChildren: 'pathToModule1'
        }
    ]
}

- child1 
{
    path: '', 
    component: Child1 
}

- child2 
{
    path: '', 
    component: Child2 
}

所以，当我在Child1上时，我想用

导航到孩子2

this.router.navigate(['../child2'], {relativeTo: this.activatedRoute})

我们得到 parent / child1 / child2

但是由于添加了延迟加载模块配置的空部分，我应该使用

this.router.navigate(['../../child2'], {relativeTo: this.activatedRoute})

因为实际上我们有 parent / child1 +''

预期行为

我们得到父母/孩子2 有没有办法改变这种行为？有许多嵌套的延迟加载模块，我们会得到一点点空的部分，我们会写../../../../../../sibling去兄弟路线。

使用说明书轻微复制问题

任何使用延迟加载模块的应用程序。只需尝试导航到兄弟路线。

plunker example 请转到会员，然后尝试使用两个按钮

Angular版本：4.1.3

浏览器：任何

Answer 1

解决方案是将路由器relativeLinkResolution设置为'corrected'。

@NgModule({
  imports: [
    RouterModule.forRoot(ROUTES, { relativeLinkResolution: 'corrected' })
  ]
})
class AppModule {}

查看更多：relativeLinkResolution

启用错误修复程序，以更正具有空路径的组件中的相对链接分辨率

使用延迟加载模块的路由器导航

1 个答案: