相关疑难解决方法(0)

我是 Angular 5 的新手，在这里我面临着组件路由的问题。

我想要做的是，当用户首先打开应用程序时，它应该显示一个登录屏幕（登录屏幕具有浏览器窗口的全高和全宽）。一旦用户成功验证，用户就会进入Home 组件。

这里 Home 组件有 Toolbar 和 Side menu bar ，如果用户从侧边菜单栏中选择了任何一个，我想在 home 组件的内容区域中显示相关（组件）数据。

截至目前一切正常，我的意思是当用户打开应用程序登录屏幕时首先显示并成功验证主页显示给用户。

当用户从侧边菜单栏中选择任何菜单时会出现问题，该组件未显示在 Home 组件的内容区域中，它作为单独的组件打开并全屏显示。

home.component.ts

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

      <mat-sidenav #drawer class="sidenav" fixedInViewport="true" [attr.role]="(isHandset$ | async) ? 'dialog' : 'navigation'"
        [mode]="(isHandset$ | async) ? 'over' : 'side'" [opened]="!(isHandset$ | async)" style="background:black">
        <mat-toolbar class="menuBar">Menus</mat-toolbar>
        <mat-nav-list>
          <a class="menuTextColor" mat-list-item routerLink="/settings">Link 1</a>
        </mat-nav-list>
      </mat-sidenav>

      <mat-sidenav-content>
        <mat-toolbar class="toolbar">
          <button class="menuTextColor" type="button" aria-label="Toggle sidenav" mat-icon-button (click)="drawer.toggle()"
            *ngIf="isHandset$ | async">
            <mat-icon aria-label="Side nav toggle icon">menu</mat-icon>
          </button>
          <span …