title: Angular lazy loading router configuration
body: <p>I want to lazy load a module in the angular 2+ application.For that  in '<strong>app-routing.module</strong>' file I have following code.</p>
  
  <pre><code>import { NgModule } from '@angular/core';
  import { Routes, RouterModule } from '@angular/router';
  import { AbcdComponent } from './abcd/abcd.component';
  
  
  const routes: Routes = [
      { path: 'portfolio', loadChildren: './lazy.module#LazyModule'},
      { path: 'dashboard', loadChildren: './lazy.module#LazyModule'},
      { path: 'abcd', component:AbcdComponent}
  ];
  @NgModule({
    imports: [RouterModule.forRoot(routes)],
    exports: [RouterModule],
    declarations: [
     AbcdComponent
  
    ]
  })
  export class AppRoutingModule { }
  </code></pre>
  
  <p>Now, in Lazy Module I have the following code:</p>
  
  <pre><code>import { NgModule } from '@angular/core';
  import { CommonModule } from '@angular/common';
  import { LazyParentComponent } from './lazy-parent/lazy-parent.component';
  import { LazyChildComponent } from './lazy-child/lazy-child.component';
  
  import { Routes, RouterModule } from '@angular/router';
  const routes: Routes = [
      { path: 'load-me', component: DashBoardComponent },
      { path: 'load-you', component: PortfolioComponent }
  
  ];
  @NgModule({
    imports: [
      CommonModule,
      RouterModule.forChild(routes)
    ],
    declarations: [
      LazyParentComponent,
      LazyChildComponent,
  
    ]
  })
  export class LazyModule { }
  </code></pre>
  
  <p>This is good enough to route <a href="https://example.com/portfolio/load-me" rel="nofollow noreferrer">https://example.com/portfolio/load-me</a> to  DashBoardComponent and <a href="https://example.com/portfolio/load-you" rel="nofollow noreferrer">https://example.com/portfolio/load-you</a> to PortfolioComponent. </p>
  
  <p>But the issue is I want to have a lazy module and for route like this <a href="https://example.com/portfolio" rel="nofollow noreferrer">https://example.com/portfolio</a> I want to point to PortfolioComponent and <a href="https://example.com/dashboard" rel="nofollow noreferrer">https://example.com/dashboard</a> to DashBoardComponent. Both components should be lazily loaded .Also, both components are in same module.I searched through internet but could not get any solution.Any help is appreciated.</p>