对angular6中的一个组件使用多路径

Question

我为admin创建一个组件Dashboard 。 我在路由中传递用户名以查找用户信息。

这是我的路线：

{path:'dashboard/:username',component:DashboardComponent,children:[
{path:'role',component:RoleComponent},

我使用这个网址：

localhost:4200/panel/dashboard/kia@kia.com

在我的Dashborad Compoent中，有一个用户菜单。

当我需要使用Role组件时，我需要使用以下网址：

localhost:4200/panel/dashboard/role

但是它不在Role组件中，但是当我使用这个时：

{path:'dashboard',component:DashboardComponent,children:[

有用 。

如何为Dashboard组件多路线？

有什么问题 ？ 我怎么解决这个问题 ？

Answer 1

在路线中尝试以下操作：

{
   path:'dashboard/:username', component: DashboardComponent
},
{
   path:'dashboard/:username/role',component: RoleComponent
}

Answer 2

对于您拥有的路线定义，您的路径应如下所示：

localhost:4200/panel/dashboard/{user}/role

例如：

localhost:4200/panel/dashboard/kia@kia.com/role

如果您要在角色html上添加“角色”作为菜单，则必须执行以下操作：

[routerLink]="['/dashboard', user , '/role']

在任何元素中使用它，例如在链接中：

<a [routerLink]="['/dashboard', user, '/role/]"> Role </a>

user是保存用户标识符的变量，例如kia@kia.com