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

platformBrowserDynamic().bootstrapModule(AppModule);
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';
import { AppComponent } from './app.component';

@NgModule({
  imports: [BrowserModule, FormsModule],
  declarations: [AppComponent],
  bootstrap: [AppComponent]
})
export class AppModule {}
import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: 'app/app.component.html'
})
export class AppComponent { }
<h2>TEMPLATE</h2>
    
<p>Use this template to build a demo to gather help or to show a potential bug report</p>
<br>
<div>
    The template uses the following versions:
    <ul>
    <li>Angular2: 2.4.9</li>
    <li>Angular2 Router: 3.4.9</li>
    <li>zone.js: 0.8.4</li>
    <li>reflect-metadata: 0.1.10</li>
    <li>systemjs: 0.20.10</li>
    <li>typescript: 2.1.6</li>
    <li>rxjs: 5.2.0</li>
    <li>plugins-typescript: latest available (typescript transpiler)</li>
    <li>in-memory-web-api: latest avaialble (used to intercept requests using the http module)</li>
    </ul>
</div>
<br/>
<strong>HOW TO USE</strong>
<ol>
<li>Change the title in index.html</li>
<li>Make sure the Angular2 components versions match the versions you are using</li>
</ol>
<hr>
<div>Provided to you by <a href="http://www.domstamand.com">Dominique St-Amand</a></div>
{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": true,
    "suppressImplicitAnyIndexErrors": true
  }
}
<!DOCTYPE html>
<html>
  <head>
    <title>Dominique St-Amand Plunker template for Angular2</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- 1. Load libraries -->
     <!-- Polyfill(s) for older browsers -->
    <script src="https://npmcdn.com/core-js/client/shim.min.js"></script>

    <script src="https://npmcdn.com/zone.js@0.8.4?main=browser"></script>
    <script src="https://npmcdn.com/reflect-metadata@0.1.10"></script>
    <script src="https://npmcdn.com/systemjs@0.20.10/dist/system.src.js"></script>

    <!-- 2. Configure SystemJS -->
    <script src="systemjs.config.js"></script>
    <script>
      System.import('app').catch(function(err){ console.error(err); });
    </script>
  </head>

  <!-- 3. Display the application -->
  <body>
    <app-root>Loading...</app-root>
  </body>
</html>
/**
 * System configuration for Angular samples
 * Adjust as necessary for your application needs.
 */
(function (global) {
    var ng2Version = '2.4.9';
    var ng2RouterVersion = '3.4.9';
    var typescriptVersion = '2.1.6';
    var rxJsVersion = '5.2.0';
    System.config({
        // map tells the System loader where to look for things
        map: {
            // our app is within the app folder
            app : 'app',
            // angular bundles
            '@angular/core': 'https://npmcdn.com/@angular/core@' + ng2Version + '/bundles/core.umd.min.js',
            '@angular/forms': 'https://npmcdn.com/@angular/forms@' + ng2Version + '/bundles/forms.umd.min.js',
            '@angular/common': 'https://npmcdn.com/@angular/common@' + ng2Version + '/bundles/common.umd.min.js',
            '@angular/compiler': 'https://npmcdn.com/@angular/compiler@' + ng2Version + '/bundles/compiler.umd.min.js',
            '@angular/platform-browser': 'https://npmcdn.com/@angular/platform-browser@' + ng2Version + '/bundles/platform-browser.umd.min.js',
            '@angular/platform-browser-dynamic': 'https://npmcdn.com/@angular/platform-browser-dynamic@' + ng2Version + '/bundles/platform-browser-dynamic.umd.min.js',
            '@angular/http': 'https://npmcdn.com/@angular/http@' + ng2Version + '/bundles/http.umd.min.js',
            '@angular/router': 'https://npmcdn.com/@angular/router@' + ng2RouterVersion + '/bundles/router.umd.min.js',
            'in-memory-web-api' : 'https://npmcdn.com/angular-in-memory-web-api',
            // other libraries
            'rxjs': 'https://npmcdn.com/rxjs@' + rxJsVersion,
            'ts': 'https://npmcdn.com/plugin-typescript', // transpiler, use latest
            'typescript': 'https://npmcdn.com/typescript@' + typescriptVersion + '/lib/typescript.js'
        },
        // packages tells the System loader how to load when no filename and/or no extension
        packages: {
            app: { main: 'main.ts', defaultExtension: 'ts' },
            rxjs: { defaultExtension: 'js' },
            'in-memory-web-api': { defaultExtension: 'js' }
        },
        transpiler: 'ts',
        typescriptOptions: {
          tsconfig: true
        },
        meta: {
          'typescript': {
            "exports": "ts"
          }
        }
    });
})(this);