角2が画面に出力を表示しない

Question

角2を学び始めたので、私は基本的な概念によく従っています。しかし、私は下のプログラムを実行しようとすると、私は静的にコードに設定されている値を取得しません。

import { Component,Input } from '@angular/core'; 
export class Hero { 
    id: number; 
    name: string; 
} 
hero: Hero = { 
    id: 1, 
    name: 'Windstorm' 
}; 

@Component({ 
    selector: 'my-app', 
template: '<h1>{{title}}</h1><h2>{{hero.name}} details!</h2><div><label>id: </label>{{hero.id}}</div><div><label>name: </label>{{hero.name}}</div>' 

}) 
export class AppComponent { 
    title = 'Tour of Heroes'; 
    hero = 'Windstorm'; 
} 

誰かが私が間違っているところ、私はうまくフレームワークを学び、自己学習することにより、複雑なものを試してみるとで基本的な問題を解決することができるように、また誰かが角コードをデバッグする方法を表示することができます指摘してくださいすることができ私自身？

The output which I got

Answer 1

これはhero = 'Windowstorm';{{hero.name}}で

@Component({ 
    selector: 'my-app', 
template: '<h1>{{title}}</h1><h2>{{hero.name}} details!</h2><div><label>id: </label>{{hero.id}}</div><div><label>name: </label>{{hero.name}}</div>' 

}) 
export class AppComponent { 
    title = 'Tour of Heroes'; 
    hero: Hero = { 
    id: 1, 
    name: 'Windstorm' 
    }; 
} 

を動作するはずheroがname性質を持っていないため無効です。 ブラウザのコンソールにエラーメッセージが表示されています。将来の質問にこのようなエラーを追加してください。