Question

我的Angular 5应用中有多个路由器插座。

其中一个看起来像这样：

  {
    path: "admin",
    component: AdminComponent,
    children: [
      {
        path: "",
        redirectTo: "/admin/(admin:news)",
        pathMatch: "full"
      },
      {
        path: "news",
        component: NewsComponent,
        outlet: 'admin'
      },
      {
        path: "new-post",
        component: CreatePostComponent,
        outlet: 'admin'
      }
    ]

我想创建从NewsComponent到CreatePostComponent的链接（/admin/(admin:news) =＆gt; /admin/(admin:new-post)：

<a [routerLink]="[{outlets: {admin:'new-post'}}]">Add Post</a>

但这是尝试创建路径/admin/(admin:news)/(admin:new-post)（而不是/admin/(admin:new-post)。

我该如何正确地做到这一点？

Answer 1

这是因为routerLink正在创建相对路径。

来自文档：Router Link Description

If the first segment begins with /, the router will look up the route from the root of the app.

If the first segment begins with ./, or doesn't begin with a slash, the router will instead look in the children of the current activated route.

您可以在/admin/前添加outlets以获得所需的路径。

<a [routerLink]="['/admin/', {outlets: {admin:['new-post']}}]">Add Post</a>

从同一路由器插座链接到另一个组件

1 个答案: