gistfile1.ts

// TypeScript
import {Component, View, bootstrap, For} from 'angular2/angular2';


@Component({
    selector: 'display',
})
@View({
    template:
    '<p>My name: {{ myName }}</p> ' +
    '<p>Friends:</p>' +
    '<ul> ' +
        '<li *for="#name of names">' +
            '{{ name }} ' +
        '</li> ' +
    '</ul>'
    ,
    directives: [For]
})

class DisplayComponent {
    myName: string;
    names: Array<string>;

    constructor(friends:FriendsService) {
        this.myName = "Alice";
        setInterval(function () { this.time = (new Date()).toString(); }.bind(this), 1000);
        this.names = ["Alice", "Aarav", "Martin", "Shannon", "Ariana", "Kai"];
    }
}
class FriendsService{
    names: Array<string>;

    constructor(){
        this.names = ["Alice", "Aarav", "Martin", "Shannon", "Ariana", "Kai"];
    }
}



bootstrap(DisplayComponent);