2016-06-19 19 views
3

私は、オブジェクト[]を角度2.0(rc 1)の選択リストにバインドするために使用しています。 問題は、最初に選択リストがレンダリングされたときに、適切な値/インデックスをあらかじめ選択していないことです。角度2の要素を選択するための双方向バインディングは、最初のレンダリングで選択された要素を設定しません。

以下のコード例では、 "ma"はコンポーネントの実際のクラス変数です。 maには、myItemTypesオブジェクト配列のオブジェクトの1つであるSelectedItemTypeプロパティがあります。

<select class="form-control" [(ngModel)]="ma.SelectedItemType"> 
     <option *ngFor='let item of myItemTypes' 
            [ngValue]='item'>{{item.Label}} 
     </option> 
    </select> 

私は、[選択]/[attr.selected]属性を使用して試してみたが、それは違いがないことができます。 いくつかの追加情報:私は本当にできるようにしたい、

<select class="form-control" [(ngModel)]="ma.SelectedItemType.Type"> 
      <option *ngFor='let item of myItemTypes' 
             [value]='item.Type'>{{item.Label}} 
      </option> 
</select> 

をしかし、私は以下のコードを使用して、Typeプロパティ(文字列値)に結合するか 代わりに、オブジェクトの場合は、(それが正常に動作します)オブジェクトとの双方向データバインディングを持つこと。私がここで紛失しているかもしれないものが見えますか?

答えて

1

ma.selectedItemTypeは、myItemTypeの項目を参照する必要があります。同じインスタンスを指し示す必要があり、同じコンテンツであっても別のインスタンスが動作しません。

+0

こんにちは。ありがとうございますが、同じインスタンスをどのように指し示すのかについてはわかりません。問題は、myItemTypesが、選択リストを作成するために使用しているmyItemTypeオブジェクトの別のリストであることです。そしてselectedItemTypeは別の@Inputオブジェクトから来ています。彼らは同じ "タイプ"ですが、どのようにして同じインスタンスを指し示すべきかについては本当に分かりません。 – Chinmoymohanty85

+0

あなたは 'ma.seletectItemType'のように自分の入力からの値とアイテムを比較することによって' myItemTypes'のインスタンスを調べることができます。 'ma.SelecteItemType = myItemTypes.find(val => val.label === myInput.label && val.xxx === val.xxx)' –

関連する問題