3

次の問題があります。ng-zorro-antd を使用してアプリケーションを実行しています。今は、ログインを担当するコンポーネントと登録を担当するコンポーネントの 2 つのコンポーネントを実行したいと考えています。残念ながら、問題は、これらのコンポーネントを作成した後、ルーティング/ログインまたは/登録後にどのように移動するかであり、これら2つのコンポーネントはメインテンプレートを使用し、たとえばサイドバーがあります. テンプレートを使用しないようにするにはどうすればよいですか? ログインと登録で、ログインと登録フォームのみを表示したいと思います。

多くのテンプレートで、BlankComponent の書き込みの一部として機能するのを見てきましたが、残念ながら私では機能しません。

私のルート:

const routes: Routes = [
  {
    path: '',
    component: DashboardComponent
  },
  {
    path: 'login',
    component: LoginComponent
  }
];

そして今、BlankComponent を書いていると、明白な理由から、そのようなコンポーネントがないことを示しています。パス自体を入力すると、どのコンポーネントをロードする必要があるかが指定されないため、機能しません。LoginComponentを入力すると、LoginComponentがロードされますが、これにより、共有されているサイドバーがロードされ、ルーティングレジスタに入った後、サイドバーなどなしで同じ内容のRegisterComponentが表示されるという効果が得られます. と共有。

私のAppComponent:

<nz-layout>
  <nz-sider [nzBreakpoint]="'lg'" [nzZeroTrigger]="zeroTrigger" nzCollapsible [(nzCollapsed)]="isCollapsed" [nzTrigger]="triggerTemplate"
    [nzWidth]="250" style="background-color: #000;">
    <div class="logo">
      <img src="../assets/logo.png" class="logo-img" />
    </div>
    <ul nz-menu [nzTheme]="'dark'" [nzMode]="'inline'" [nzInlineCollapsed]="isCollapsed">
      <li nz-submenu>
        <span title><i nz-icon type="money-collect" theme="outline"></i><span class="nav-text">Księgowość</span></span>
        <ul>
          <li nz-menu-item><i nz-icon type="right-circle" theme="outline"></i> Lista użytkowników</li>
          <li nz-menu-item><i nz-icon type="right-circle" theme="outline"></i> Lista transakcji</li>
          <li nz-menu-item><i nz-icon type="right-circle" theme="outline"></i> Lista dokumentów</li>
        </ul>
      </li>
      <li nz-menu-item><span><i nz-icon type="setting" theme="outline"></i><span class="nav-text">Ustawienia</span></span></li>
    </ul>
  </nz-sider>
  <nz-layout style="height: 100%">
    <nz-header class="header">
      <i class="trigger" nz-icon [type]="isCollapsed?'menu-unfold':'menu-fold'" (click)="isCollapsed=!isCollapsed"></i>
      <nz-content class="profile">

        <nz-select class="language-select" nzPlaceHolder="Language">
          <nz-option nzLabel="Polski" nzValue="pl"></nz-option>
          <nz-option nzLabel="Angielski" nzValue="eng"></nz-option>
        </nz-select> 
      </nz-content>
    </nz-header>
    <nz-content style="margin:16px;">
      <div class="content">
        <router-outlet></router-outlet>
      </div>
    </nz-content>
  </nz-layout>
</nz-layout>
<ng-template #trigger>
  <i nz-icon type="up"></i>
</ng-template>
<ng-template #zeroTrigger>
  <i nz-icon type="menu-fold" theme="outline"></i>
</ng-template>

問題は、RegisterComponent コンポーネントに入った後、AppComponent のすべてのコンテンツが表示され、RegisterComponent のコンテンツのみを読み取りたいことです。

4

0 に答える 0