title: Using another module in your module: imports vs. using loadChildren in routes
body: <p>In my exploration of Angular, I've found two possible ways to use one module inside of another.</p>
  
  <p>(Using the <a href="https://github.com/vladotesanovic/angular2-express-starter" rel="nofollow noreferrer">angular-express-starter project</a> for reference)</p>
  
  <ul>
  <li><p><strong>Method 1</strong>:
  Declare it in the <code>imports</code> array. <a href="https://github.com/vladotesanovic/angular2-express-starter/blob/master/src/app/app.module.ts#L24" rel="nofollow noreferrer">For example</a></p>
  
  <pre><code>@NgModule({
    declarations: [
      AppComponent
    ],
    imports: [
      BrowserModule,
      SharedModule,
      FormsModule
    ]
  })
  </code></pre></li>
  <li><p><strong>Method 2</strong>:
  Use <code>loadChildren</code>in the routing. <a href="https://github.com/vladotesanovic/angular2-express-starter/blob/master/src/app/app.router.ts" rel="nofollow noreferrer">For example</a>:</p>
  
  <pre><code>export const routes: Route[] = [
    { path: '', pathMatch: 'full', redirectTo: 'weather'},
    { loadChildren: 'app/dashboard/dashboard.module#DashboardModule', path: 'dashboard' },
    { loadChildren: 'app/profile/profile.module#ProfileModule', path: 'profile' },
    { loadChildren: 'app/weather/weather.module#WeatherModule', path: 'weather' }
  ];
  </code></pre></li>
  </ul>
  
  <p>What are the practical differences between these two methods?</p>