角2配列値へのバインド

Question

テンプレートビューで配列の値にバインドしようとしています。 AngularJSでは次のようにこれを達成しました

<div dx-text-box="{bindingOptions: { 
     value: 'mainTableData[0].{{childControl.FieldName}}' 
}}"></div> 

これはうまくいきましたが、Angular2で失敗しました。以下は私が試したものです。

<dx-text-box 
     [(value)]="mainTableData[0].{{childControl.FieldName}}"> 
</dx-text-box> 

これを行う正しい方法は何でしょうか？私は正しい配列値を返す関数に変更しようとしましたが、これも失敗します。 （仮定：mainTableData[0].childControl.FieldNameはあなたのcomponent.ts上）

Answer 1

それはおそらくこのようなものになります。

<div [attr.dx-text-box] = "{bindingOptions: { 
    value: 'mainTableData[0].{{childControl.FieldName}}'}}"> 
</div> 

Answer 2

これを試してみてください：

<dx-text-box 
     [value]="mainTableData[0].childControl.FieldName"> 
</dx-text-box> 

あなたはまた、カスタムを追加することができた場合は、実行して属性

<dx-text-box 
     [(value)]="mainTableData[0].childControl.FieldName"> 
</dx-text-box> 

Answer 3

潜在的にあなたの価値を得るために関数を使用することができますか？テンプレート？あなたのdx-text-boxコンポーネント内

public getMyValue(name) { 
    return this.mainTableData[0][name]; 
} 

public updateValue(event) { 
    console.log("new value", event.target.value); 
} 

： - - ：あなたの親コンポーネント内部

<dx-text-box 
     [value]="getMyValue(childControl.FieldName)" (valueChanged)="updateValue($event)> 
</dx-text-box> 

@Ouput public valueChanged: EventEmitter<any> = new EventEmitter(); 

public functionThatsFiredWhenChangesHappen(value) { 
    this.valueChanged.emit(value); 
}