title: Login and registration screen
body: <p>I have the following problem, I'm doing applications using ng-zorro-antd, and now I would like to do 2 components, one responsible for logging in, the other for registration. Unfortunately, the problem is that after creating these components, how to go after routing / login or / register then these 2 components use the main template and for example I have a sidebar. How can I make them not use any template? I would like the login and register to show only login and registration forms.</p>
  
  <p>I have seen in many templates that as part of the BlankComponent write and it works, unfortunately it does not work with me.</p>
  
  <p>My routes:</p>
  
  <pre><code>const routes: Routes = [
    {
      path: '',
      component: DashboardComponent
    },
    {
      path: 'login',
      component: LoginComponent
    }
  ];
  </code></pre>
  
  <p>And now, as I write BlankComponent, for obvious reasons, it shows that there is no such component, if I enter the path itself, it also will not work because it will not be given what component should be loaded. If I enter LoginComponent, it will load the LoginComponent to me, but with this I will load the Sidebar which is in shared, and I want to get the effect that after entering the routing register I will see the same content RegisterComponent, without sidebar etc. with shared.</p>
  
  <p>My AppComponent:</p>
  
  <pre><code>&lt;nz-layout&gt;
    &lt;nz-sider [nzBreakpoint]="'lg'" [nzZeroTrigger]="zeroTrigger" nzCollapsible [(nzCollapsed)]="isCollapsed" [nzTrigger]="triggerTemplate"
      [nzWidth]="250" style="background-color: #000;"&gt;
      &lt;div class="logo"&gt;
        &lt;img src="../assets/logo.png" class="logo-img" /&gt;
      &lt;/div&gt;
      &lt;ul nz-menu [nzTheme]="'dark'" [nzMode]="'inline'" [nzInlineCollapsed]="isCollapsed"&gt;
        &lt;li nz-submenu&gt;
          &lt;span title&gt;&lt;i nz-icon type="money-collect" theme="outline"&gt;&lt;/i&gt;&lt;span class="nav-text"&gt;Księgowość&lt;/span&gt;&lt;/span&gt;
          &lt;ul&gt;
            &lt;li nz-menu-item&gt;&lt;i nz-icon type="right-circle" theme="outline"&gt;&lt;/i&gt; Lista użytkowników&lt;/li&gt;
            &lt;li nz-menu-item&gt;&lt;i nz-icon type="right-circle" theme="outline"&gt;&lt;/i&gt; Lista transakcji&lt;/li&gt;
            &lt;li nz-menu-item&gt;&lt;i nz-icon type="right-circle" theme="outline"&gt;&lt;/i&gt; Lista dokumentów&lt;/li&gt;
          &lt;/ul&gt;
        &lt;/li&gt;
        &lt;li nz-menu-item&gt;&lt;span&gt;&lt;i nz-icon type="setting" theme="outline"&gt;&lt;/i&gt;&lt;span class="nav-text"&gt;Ustawienia&lt;/span&gt;&lt;/span&gt;&lt;/li&gt;
      &lt;/ul&gt;
    &lt;/nz-sider&gt;
    &lt;nz-layout style="height: 100%"&gt;
      &lt;nz-header class="header"&gt;
        &lt;i class="trigger" nz-icon [type]="isCollapsed?'menu-unfold':'menu-fold'" (click)="isCollapsed=!isCollapsed"&gt;&lt;/i&gt;
        &lt;nz-content class="profile"&gt;
  
          &lt;nz-select class="language-select" nzPlaceHolder="Language"&gt;
            &lt;nz-option nzLabel="Polski" nzValue="pl"&gt;&lt;/nz-option&gt;
            &lt;nz-option nzLabel="Angielski" nzValue="eng"&gt;&lt;/nz-option&gt;
          &lt;/nz-select&gt; 
        &lt;/nz-content&gt;
      &lt;/nz-header&gt;
      &lt;nz-content style="margin:16px;"&gt;
        &lt;div class="content"&gt;
          &lt;router-outlet&gt;&lt;/router-outlet&gt;
        &lt;/div&gt;
      &lt;/nz-content&gt;
    &lt;/nz-layout&gt;
  &lt;/nz-layout&gt;
  &lt;ng-template #trigger&gt;
    &lt;i nz-icon type="up"&gt;&lt;/i&gt;
  &lt;/ng-template&gt;
  &lt;ng-template #zeroTrigger&gt;
    &lt;i nz-icon type="menu-fold" theme="outline"&gt;&lt;/i&gt;
  &lt;/ng-template&gt;
  </code></pre>
  
  <p>And the problem is that after entering the RegisterComponent component all the content of the AppComponent appears to me, and I want to only read the contents of RegisterComponent</p>