Package Exports
- @angularclass/hmr
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@angularclass/hmr) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
Angular 2 Hot Module Replacement
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