title: Angular 2 - Show load animation during preloadingStrategy execution
body: <p>We have configured <code>preloadingStrategy: PreloadAllModules</code> in our routing-file  <em>app-routing.module.ts</em> to load all modules at the first page load. Because it's a bit lagging, we would like to show a load animation until the last module is loaded. Is this possible?</p>
  
  <p><strong>app-routing.component.ts</strong>:</p>
  
  <pre><code>@NgModule({
      imports: [RouterModule.forRoot(routes, { preloadingStrategy: PreloadAllModules })],
      exports: [RouterModule]
  })
  </code></pre>
  
  <p>We have allready implemented a gif animation for re-routing. </p>
  
  <p><strong>app.component.ts</strong>:</p>
  
  <pre><code>router.events.subscribe((routerEvent: Event) =&gt; {
      this.checkRouterEvent(routerEvent);
  });
  ....
  
  checkRouterEvent(routerEvent: Event): void {
      if (routerEvent instanceof NavigationStart) {
         this.loading = true;
      }
  
      // this.loading is just a boolean to show &lt;div&gt; with animation inside or not.
      if (routerEvent instanceof NavigationCancel ||
         routerEvent instanceof NavigationEnd ||
         routerEvent instanceof NavigationError) {
         this.loading = false;
      }
  }
  </code></pre>