登录和注册屏幕

Paw*_*elC 5 angular ng-zorro-antd

我有以下问题,我正在使用 ng-zorro-antd 做应用程序,现在我想做 2 个组件,一个负责登录,另一个负责注册。不幸的是,问题是创建这些组件后,如何在路由/登录或/注册之后进行,然后这两个组件使用主模板,例如我有一个侧边栏。我怎样才能让他们不使用任何模板?我希望登录和注册仅显示登录和注册表单。

\n\n

我在许多模板中看到,作为 BlankComponent 的一部分编写并且它可以工作,不幸的是它对我不起作用。

\n\n

我的路线:

\n\n
const routes: Routes = [\n  {\n    path: \'\',\n    component: DashboardComponent\n  },\n  {\n    path: \'login\',\n    component: LoginComponent\n  }\n];\n
Run Code Online (Sandbox Code Playgroud)\n\n

现在,当我编写 BlankComponent 时,出于明显的原因,它表明不存在这样的组件,如果我输入路径本身,它也将不起作用,因为它不会给出应该加载什么组件。如果我输入LoginComponent,它会加载LoginComponent给我,但是这样我会加载共享的侧边栏,我想得到这样的效果:进入路由寄存器后我会看到相同的内容RegisterComponent,没有侧边栏等. 与共享。

\n\n

我的应用程序组件:

\n\n
<nz-layout>\n  <nz-sider [nzBreakpoint]="\'lg\'" [nzZeroTrigger]="zeroTrigger" nzCollapsible [(nzCollapsed)]="isCollapsed" [nzTrigger]="triggerTemplate"\n    [nzWidth]="250" style="background-color: #000;">\n    <div class="logo">\n      <img src="../assets/logo.png" class="logo-img" />\n    </div>\n    <ul nz-menu [nzTheme]="\'dark\'" [nzMode]="\'inline\'" [nzInlineCollapsed]="isCollapsed">\n      <li nz-submenu>\n        <span title><i nz-icon type="money-collect" theme="outline"></i><span class="nav-text">Ksi\xc4\x99gowo\xc5\x9b\xc4\x87</span></span>\n        <ul>\n          <li nz-menu-item><i nz-icon type="right-circle" theme="outline"></i> Lista u\xc5\xbcytkownik\xc3\xb3w</li>\n          <li nz-menu-item><i nz-icon type="right-circle" theme="outline"></i> Lista transakcji</li>\n          <li nz-menu-item><i nz-icon type="right-circle" theme="outline"></i> Lista dokument\xc3\xb3w</li>\n        </ul>\n      </li>\n      <li nz-menu-item><span><i nz-icon type="setting" theme="outline"></i><span class="nav-text">Ustawienia</span></span></li>\n    </ul>\n  </nz-sider>\n  <nz-layout style="height: 100%">\n    <nz-header class="header">\n      <i class="trigger" nz-icon [type]="isCollapsed?\'menu-unfold\':\'menu-fold\'" (click)="isCollapsed=!isCollapsed"></i>\n      <nz-content class="profile">\n\n        <nz-select class="language-select" nzPlaceHolder="Language">\n          <nz-option nzLabel="Polski" nzValue="pl"></nz-option>\n          <nz-option nzLabel="Angielski" nzValue="eng"></nz-option>\n        </nz-select> \n      </nz-content>\n    </nz-header>\n    <nz-content style="margin:16px;">\n      <div class="content">\n        <router-outlet></router-outlet>\n      </div>\n    </nz-content>\n  </nz-layout>\n</nz-layout>\n<ng-template #trigger>\n  <i nz-icon type="up"></i>\n</ng-template>\n<ng-template #zeroTrigger>\n  <i nz-icon type="menu-fold" theme="outline"></i>\n</ng-template>\n
Run Code Online (Sandbox Code Playgroud)\n\n

问题是,进入RegisterComponent组件后,AppComponent的所有内容都会出现在我面前,而我只想读取RegisterComponent的内容

\n