导航栏已由有角路由器出口移除

Question

我有一个应用程序，其中有标题和侧边栏。看起来像这样：

<mat-drawer-container class="sidenav-container">

    <app-side-nav></app-side-nav>

  <mat-drawer-content>
    <app-header></app-header>
    <main>
      <router-outlet></router-outlet>
    </main>
  </mat-drawer-content>
</mat-drawer-container>

侧面导航包含2个模块作为可单击链接（例如，module1，module2）。 Module1包含3个名为my identity,users and container. 的组件 这是容器html：

   <nav mat-tab-nav-bar>
      <a mat-tab-link [routerLink]="['/identity/my-identity']">My 
     Identity</a>

      <a mat-tab-link [routerLink]="['/identity/users']">Users</a>
    </<nav mat-tab-nav-bar>

我的计划是从容器导航到身份或用户。 在图片中，当我单击module1时，您可以看到当前页面。但是不幸的是，每当我单击标识或用户时，它都会正确加载该组件，但导航菜单会消失。

我想要以下行为：默认情况下，单击module1应该加载my identity，并且我可以导航到用户而不会消失导航菜单。我应该怎么做或更正？

Answer 1

那是因为您的标签Identity和Users是单个路由器出口的一部分。

尝试在包含它们的组件中遵循以下结构：

<nav mat-tab-nav-bar>

</nav mat-tab-nav-bar>
<router-outlet></router-outlet>

使用the documentation正确实施。

然后可以声明此路线的子级。这意味着正确完成操作后，您将仅更改深度n°2（第二个router-outlet），而不是第一个。

但是，如果想要更具体的答案，请考虑再提供一个最小且可重现的示例。