角度路由，使用网点创建路由答案

【问题标题】：Angular routing, create route using outlets角度路由，使用网点创建路由
【发布时间】：2020-06-09 08:38:58
【问题描述】：

我的应用程序无需路由即可工作。但是有个地方可以打开Dialog窗口，也不需要路由。

在这个对话框中我有一个按钮。如果我点击这个按钮，应该会出现滑动面板，我也可以关闭它。

我使用 route-outlet 打开滑动面板。

在 Html 我有这样的东西：

<button (click)="showAddLinkSlidePanel()"></button>
<router-outlet name="addLinkSlidePanel"></router-outlet>

打字稿：

showAddLinkSlidePanel() {
        this.router.navigate([{ outlets: { addLinkSlidePanel: 'insert-link' } }], { state: 'some data here', skipLocationChange: true });
    }

所以，我只是重定向到另一个页面而不更改 URL

当我从 DialogWindow 模块导入 RouterModule 时，我有这个

RouterModule.forChild([
    {
        path: 'insert-link',
        component: AddLinkSlidePanelComponent,
        outlet: 'addLinkSlidePanel',
    },
])

在我的 App.module 中

RouterModule.forRoot([])

但是。如果我打开对话框窗口，单击按钮显示幻灯片面板，使用路由关闭它

this.router.navigate([{ outlets: { addLinkSlidePanel: null } }], {
            skipLocationChange: false,
        });

在关闭对话框并再次打开它后，我遇到了异常，正在显示滑动面板.. 我确定是因为我没有错误地导入 RouteModule。也许你可以给我建议我做错了什么。谢谢。

【问题讨论】：

标签： javascript angular angular2-routing

【解决方案1】：

我已经添加了

.forChild([
  {
    path: '',
    outlet: 'addLinkSlidePanel',
    component: null,
    children: [],
  },
  {
    path: 'insert-link',
    component: AddLinkSlidePanelComponent,
    outlet: 'addLinkSlidePanel',
    children: [],
  },
])

和

.forRoot([])

有效！

【讨论】：