angular-cn/public/docs/_examples/displaying-data/ts/app/app.component.ts

35 lines
705 B
TypeScript

// #docplaster
// #docregion final
// #docregion imports
import {Component} from 'angular2/core';
// #enddocregion imports
import {Hero} from './hero'
@Component({
selector: 'my-app',
template: `
<h1>{{title}}</h1>
<h2>My favorite hero is: {{myHero.name}}</h2>
<p>Heroes:</p>
<ul>
<li *ngFor="#hero of heroes">
{{ hero.name }}
</li>
</ul>
// #docregion message
<p *ngIf="heroes.length > 3">There are many heroes!</p>
// #enddocregion message
`
})
export class AppComponent {
title = 'Tour of Heroes';
heroes = [
new Hero(1, 'Windstorm'),
new Hero(13, 'Bombasto'),
new Hero(15, 'Magneta'),
new Hero(20, 'Tornado')
];
myHero = this.heroes[0];
}