Angular2-HMR
This module requires Angular 2.0.0-rc.5 or higher. Please see repository Angular 2 Seed for a working example.
also download https://github.com/AngularClass/angular2-hmr-loader
main.browser.ts
import { removeNgStyles, createNewHosts, bootloader } from '@angularclass/hmr';
@NgModule({
bootstrap: [
App
],
declarations: [
App
],
imports: [
// Angular 2
BrowserModule,
FormsModule,
HttpModule,
RouterModule.forRoot([], {
useHash: true
}),
// app
appModule
// vendors
],
providers: []
})
class MainModule {
constructor(public appRef: ApplicationRef) {}
hmrOnInit(store) {
console.log('HMR store', store);
}
hmrOnDestroy(store) {
var cmpLocation = this.appRef.components.map(cmp => cmp.location.nativeElement);
// recreate elements
store.disposeOldHosts = createNewHosts(cmpLocation)
// remove styles
removeNgStyles();
}
hmrAfterDestroy(store) {
// display new elements
store.disposeOldHosts()
delete store.disposeOldHosts;
}
}
export function main() {
return platformBrowserDynamic().bootstrapModule(MainModule);
}
// boot on document ready
bootloader(main);enjoy — AngularClass
Learn AngularJS, Angular 2, and Modern Web Development from the best. Looking for corporate Angular training, want to host us, or Angular consulting? patrick@angularclass.com