title: How can route in lazy loading children's children Angular?
body: <h1>How can restrict route in lazy loading children's children Angular?</h1>
  <blockquote>
  <p>when I &gt;route to <code>http://localhost:4200/auth/login</code> login component works and when I route to <code>http://localhost:4200/login</code> login component works I want when I route to <code>http://localhost:4200/login</code>
  <strong>going to not found page</strong></p>
  </blockquote>
  <p><code>app-routing.module.ts</code></p>
  <pre class="lang-js prettyprint-override"><code>const routes: Routes = [
      {path: '', component: AppComponent, pathMatch: 'full'},
      {
          path: 'auth',
          loadChildren: () =&gt; import('./modules/authentication/authentication.module').then(m =&gt; m.AuthenticationModule)
      }
  ];
  
  @NgModule({
      imports: [RouterModule.forRoot(routes)],
      exports: [RouterModule]
  })
  </code></pre>
  <p><code>authentication-routing.module.ts</code></p>
  <pre class="lang-js prettyprint-override"><code>const routes: Routes = [
          {
              path: '', component: AuthenticationComponent, children: [
                  {path: '', redirectTo: 'login', pathMatch: 'full'},
                  {path: 'login', component: LoginComponent},
                  {path: 'signup', component: SignUpComponent},
              ]
          },
  
      ]
  ;
  
  @NgModule({
      imports: [RouterModule.forChild(routes)],
      exports: [RouterModule]
  })
  </code></pre>