In Angular2Spa, fix HMR with 2.4.6 and relax version dependency to allow arbitrary 2.x again. Fixes #643

Author: SteveSandersonMS

templates/Angular2Spa/ClientApp/boot-client.ts

@@ -3,11 +3,18 @@ import { enableProdMode } from '@angular/core';
 import { platformUniversalDynamic } from 'angular2-universal';
 import { AppModule } from './app/app.module';
 import 'bootstrap';
+const rootElemTagName = 'app'; // Update this if you change your root component selector
 
 // Enable either Hot Module Reloading or production mode
 if (module['hot']) {
     module['hot'].accept();
-    module['hot'].dispose(() => { platform.destroy(); });
+    module['hot'].dispose(() => {
+        // Before restarting the app, we create a new root element and dispose the old one
+        const oldRootElem = document.querySelector(rootElemTagName);
+        const newRootElem = document.createElement(rootElemTagName);
+        oldRootElem.parentNode.insertBefore(newRootElem, oldRootElem);
+        platform.destroy();
+    });
 } else {
     enableProdMode();
 }

templates/Angular2Spa/package-2.4.5.json

@@ -5,14 +5,14 @@
     "test": "karma start ClientApp/test/karma.conf.js"
   },
   "dependencies": {
-    "@angular/common": "2.4.5",
-    "@angular/compiler": "2.4.5",
-    "@angular/core": "2.4.5",
-    "@angular/forms": "2.4.5",
-    "@angular/http": "2.4.5",
-    "@angular/platform-browser": "2.4.5",
-    "@angular/platform-browser-dynamic": "2.4.5",
-    "@angular/platform-server": "2.4.5",
+    "@angular/common": "^2.4.5",
+    "@angular/compiler": "^2.4.5",
+    "@angular/core": "^2.4.5",
+    "@angular/forms": "^2.4.5",
+    "@angular/http": "^2.4.5",
+    "@angular/platform-browser": "^2.4.5",
+    "@angular/platform-browser-dynamic": "^2.4.5",
+    "@angular/platform-server": "^2.4.5",
     "@angular/router": "^3.4.5",
     "@types/node": "^6.0.42",
     "angular2-platform-node": "~2.0.11",