Angular 2 RC5 prefetching dynamic templates from components

53 views
Skip to first unread message

stjohn....@beyonddata.co.za

unread,
Aug 19, 2016, 5:48:23 AM8/19/16
to AngularJS

I wrote a little web-app in Angular 2 RC4 which uses dynamic templates, served by a .net core back end. When navigating to a defined route the template would be fetched and rendered as expected.

I followed the official RC4 TO RC5 migration. Everything seemed to be working correctly until I checked the network tab in chrome dev console. My dynamic templates are all being prefeteched when angular loads, instead of when the the template is required. I have looked around but I haven't seen anything that mentions this change.

Am I missing something ?


My Code


main.ts

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app.module';
platformBrowserDynamic().bootstrapModule(AppModule);


app.module.ts

import { NgModule }      from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { RouterModule } from '@angular/router';
import { AppComponent }  from './app.component';
import { Home }  from './home.component';
import { Signup }  from './signup.component';

@NgModule({
  imports: [BrowserModule,
    RouterModule.forRoot([
        { path: '', component: Home },
        { path: 'Signup', component: Signup }
    ], { useHash: true })],
declarations: [AppComponent, Home, Signup],
bootstrap: [AppComponent]
})
export class AppModule { }


app.component.ts

import { Component } from '@angular/core';
import { ROUTER_DIRECTIVES } from '@angular/router';

@Component({
  selector: 'my-app',
  template: `
    <p>Angular 2 is running...</p>
    <!-- Routed views go here -->
    <router-outlet></router-outlet>
    `,
directives: [ROUTER_DIRECTIVES]
})
export class AppComponent { }


home.component.ts

import { Component } from '@angular/core';
@Component({
  selector: 'my-app',
  templateUrl: '/View/Landing'
})
export class Home { }


signup.component

import { Component } from '@angular/core';
@Component({
  selector: 'my-app',
  templateUrl: '/View/Signup'
})
export class Signup{ }




Reply all
Reply to author
Forward
0 new messages