データバインディングは角4で機能していません

Question

これはおそらくあまりにも基本的ですが、私はそれを理解することができませんでした。

私はアングル4で作業しています。私は競争という「アプリ」フォルダ内にフォルダを持っています。

ここで私はこのような私の競技-detail.component.tsファイルがあります。そして、私は私のテンプレートファイル持って

import { Component } from '@angular/core' 

@Component({ 
    moduleId: module.id, 
    selector: 'competitions-detail', 
    templateUrl: 'competitions-detail.component.html', 
    styleUrls: [ 'competitions-detail.component.css' ] 
}) 

export class CompetitionsDetailComponent { 
    title: 'Competencias'; 
} 

を：

<md-toolbar color="primary"> 
    <md-icon>data_usage</md-icon> 
    <span><strong>LA M10</strong></span> 
    <span class="spacer"></span> 
    <span><strong>COMPETENCIAS</strong></span> 
</md-toolbar> 

<h1>COMPETENCIAS</h1> 
<h1>{{title}}</h1> 
<h2>COMPETENCIAS</h2> 
<h2>{{title}}</h2> 

をそして、これがAS Result

です私はそれらが表示されている値をハードコードする場合、テンプレートが正常に動作していることがわかります、私はそこにいくつかの材料設計コンポーネントがありますが、何らかの理由で、単純なデータb {{}}はタイトル値を表示していません。

私には何が欠けていますか？

Answer 1

あなたはタイプを割り当て、実際にフィールドに設定されていません。Compentencias

Answer 2

クラスではありません：あなたはそれを持っていた

title: string = 'Competencias'; 

方法は、フィールドtitleのみ文字列値を持つことができることを確認しましたオブジェクト。これは、=の代わりに、次のようになります。

export class CompetitionsDetailComponent{ 
    title = "Competencias"; 
} 

Answer 3

輸出クラスCompetitionsDetailComponent {タイトル= 'Competencias' を試してみてください。 }

代わりの

エクスポートクラスCompetitionsDetailComponent {タイトル： 'Competencias'。 }

Answer 4

変数の割り当てと宣言に問題があると思います。

タイトル：文字列= 'Competencias'

Answer 5

変数の割り当ては、それは=の代わりに、次のようになります。

export class CompetitionsDetailComponent{ 
    title = "Competencias"; 
}