通過Angular 2中的ngModel選擇列表獲取對象屬性？

Question

我有讀取已經從在角2（RC1）選擇列表中選擇的對象的屬性的問題。看看下面的語法：

<select required [(ngModel)]="model.plan"> 
    <option selected="selected" disabled>Plan...</option> 
    <option *ngFor="#plan of plans" [value]="plan">{{ plan.name }}</option> 
</select> 

凡plans被定義爲對象的數組：

[{ name: 'Plan 1' }, { name: 'Plan 2' }] 

如果你嘗試和輸出所選對象的關鍵之一的價值，沒有什麼似乎是顯示：

<p>{{ model.plan?.name }}</p> // Shows nothing if a plan is selected 

Here is a fork of the Angular2 form live demo，可見這個問題。從選擇列表中選擇「計劃2」，並查看沒有顯示任何內容。

這是怎麼回事嗎？

Answer 1

要使用對象的值使用[ngValue]而不是[value]。 [value]僅支持字符串ID。

<select required [(ngModel)]="model"> <!-- <== changed --> 
    <option selected="selected" disabled>Plan...</option> 
    <option *ngFor="#plan of plans" [ngValue]="plan">{{ plan.name }}</option> 
</select> 

Plunker example

model需要指向元件中的一箇中作爲plans默認值工作（它需要是相同的情況下，不包含相同的值的另一實例）。

Answer 2

至於我可以看到，仍然有具有雙向綁定到select的問題。所以，試試這個：

模板

<select required [(ngModel)]="model.plan" (change)="setPlan($event.target.value)"> 
    <option selected="selected" disabled>Plan...</option> 
    <option *ngFor="#plan of plans" [value]="plan.name">{{ plan.name }}</option> 
</select> 

組件類

setPlan(value) { 
    //if you're on older versions of ES, use for-in instead 
    var plan = this.plans.find(p => p.name = value); 

    if(plan) { this.model.plan = plan; } 
} 

無法嘗試，因爲某些原因plunkr從來沒有爲我工作。