Angular2导航和子导航嵌套路由

Question

我有一个导航菜单和一个子导航菜单。你可以查看路由配置。

export const appRoutes: Route[] = [
{
path: "user",
component: UserComponent,
children: [
{ path: "login", component: LoginComponent },
{ path: "register", component: RegisterComponent }
]
},
{
path: "consultants",
component: ConsultantsComponent,
children: [
{
path: "find-consultant",
component: FindConsultantComponent
},
{ path: "login-consultant", component: LoginConsultantComponent }
]
}
];

导航菜单和子导航菜单正在工作并加载组件。这里的场景是当我单击user->register时，RegisterComponent被加载。后来我点击consultants->find-consultant, FindConsultantComponent被加载。转回User后，RegisterComponent未激活。我创建了一个stackblitz https://stackblitz.com/edit/navbar-routing

Answer 1

我检查了你的代码。我在consultants.component.html中发现了一个问题文件。请将您的代码替换为以下代码，然后它将正常工作。

consultants.component.html

<div class="col-lg-5">
<ul class="nav nav-underline">
<li class="nav-item">
<a class="nav-link" data-bs-target="#login" data-bs-toggle="tab" role="tab"
routerLink="/user/login">Login</a>
</li>
<li class="nav-item">
<a class="nav-link" data-bs-target="#register" data-bs-toggle="tab" role="tab"
routerLink="/user/register">Register</a>
</li>
</ul>
<div class="tab-content">
<router-outlet></router-outlet>
</div>
</div>