<!DOCTYPE html>
<html>

  <head>
    <title>Angular 2 QuickStart</title>

    <!-- 1. Load libraries -->
    <script src="https://rawgithub.com/systemjs/systemjs/0.19.6/dist/system.js"></script>
    <script src="https://code.angularjs.org/tools/typescript.js"></script>
    <script src="https://code.angularjs.org/2.0.0-beta.0/angular2-polyfills.js"></script>
    <script src="https://code.angularjs.org/2.0.0-beta.0/Rx.js"></script>
    <script src="https://code.angularjs.org/2.0.0-beta.0/angular2.dev.js"></script>

    <!-- 2. Configure SystemJS -->
    <script>
      System.config({
        transpiler: 'typescript', 
        typescriptOptions: { emitDecoratorMetadata: true }, 
        packages: {'src': {defaultExtension: 'ts'}} 
      });
    </script>

    <!-- 3. Bootstrap -->
    <script>
      System.import('angular2/platform/browser').then(function(ng){
        System.import('src/hello_world').then(function(src) {
          ng.bootstrap(src.App);
        });
      });
    </script>

  </head>

  <!-- 4. Display the application -->
  <body>
    <app>loading...</app>
  </body>

</html>
import {Component} from 'angular2/core';

@Component({
  // Declare the tag name in index.html to where the component attaches
  selector: 'hello-world',
  
  // Location of the template for this component
  templateUrl: 'src/hello_world.html',
  inputs: ['customName']
})
export class HelloWorld {
  
  // Declaring the variable for binding with initial value
  customName: string = '';
}

@Component({
  // Declare the tag name in index.html to where the component attaches
  selector: 'hello-world',
  
  // Location of the template for this component
  templateUrl: 'src/hello_world.html',
  inputs: ['customName']
})
export class HelloWorld2 {
  
  // Declaring the variable for binding with initial value
  customName: string = '';
}

@Component({
  selector: 'app',
  template: `
    <hello-world [customName]="'custom name'"></hello-world>
  `,
  directives: [HelloWorld, HelloWorld2]
})
export class App {}

<h1>Hello {{customName}}!</h1>