Question

我正在尝试使用routerLink来访问生成模态的命名routeroutlet。如果我直接在浏览器中访问URL，它会很好地工作。但是，当我尝试通过routerLink访问它时，它不起作用。我已经尝试过可以想到的每一种变化形式，但仍然无法正常工作。路由器调试似乎建议将路径的命名出口部分附加到现有URL的命名出口部分。

这是路由器配置：

  ...{
    path: 'edit-doc/risk/step-1',
    outlet: 'modal',
    component: DocEditRiskStepOneComponent
  },
  {
    path: 'edit-doc/risk/step-2',
    outlet: 'modal',
    component: DocEditRiskStepTwoComponent
  },
  {
    path: 'edit-doc',
    component: DocEditComponent,
    children: [
      {
        path: 'risk',
        component: DocEditRiskComponent
      }
    ]...

这是app.html：

<sl-app-modal *ngIf="true"></sl-app-modal>
<router-outlet></router-outlet>

以下是访问正确页面并启动模式的URL：

http://localhost:4200/edit-doc/risk(modal:edit-doc/risk/step-1)  // this works

如果我想将模式的内容推进到“ step-2”，则可以使用以下URL：

http://localhost:4200/edit-doc/risk(modal:edit-doc/risk/step-2)

但是，如果我尝试使用routerLink进行相同的操作，则无法正常工作。这是我尝试过的routeLink。它应该使基础页面保持相同，但要推进模式内容：

<button [routerLink]="['/edit-doc/risk', { outlets: { modal: ['edit-doc/risk/step-2'] } }]">

路由器调试显示：

NavigationEnd...
id: 2
url: "/edit-doc/risk/(modal:edit-doc%2Frisk%2Fstep-2)(modal:edit-doc/risk/step-1)"
urlAfterRedirects: "/edit-doc/risk(modal:edit-doc/risk/step-1)"

因此，URL似乎是部分正确的，但命名的插座部分不会替换现有的命名的插座部分。我真的不知道为什么。

具有命名的routeroutlet的角形routerlink正在复制URL

0 个答案: