2016-10-02 17 views
1

データをコンポーネントに渡そうとしています。ここにコンポーネントのコードがあります。入力属性がデータを受け取りません

export class requestDetailComponent{ 
    @Input() id; 
    @Input() name; 
    @Input() email; 
    @Input() purpose; 
    @Input() programme; 
    @Input() language; 
    @Input() comments; 

    visible = false; 
    toggle() { 
    this.visible = !this.visible; 
    } 

とテンプレートは次のとおりです。ここで

<div class="col-sm-5">  
    <label>{{name}}</label> 
</div> 

は私がデータを渡す親コンポーネントです

<ul> 
     <li> 
      <request-detail [name]='Salman'></request-detail> 
     </li> 
</ul> 

私はSalmanは、子コンポーネントに表示されることを期待するが、それはdoesnの起こることはありません 何が問題ですか?

答えて

8

我々はそれを知っておく必要があります。両方のオプションを使用できるように

name="Salman" 

[name]="'Salman'" 

のためだけの糖です。

も参照してくださいAngular 2 Template SyntaxビクターSavkin

によってあなたは、次の構文を使用する場合:

[name]='Salman' 

を、あなたはあなたのコンポーネントクラスにSalman変数を宣言する必要があります。

class ParentComponent { 
    Salman = 'Salman' 
} 

Angular2コンポーネントを使用していますビュー内の変数にアクセスするインスタンススコープ

あなたの親コンポーネントでSalman変数を持っていない場合は、

enter image description here

下の画像を参照してください
関連する問題