角度2別のモデルのデフォルトを使用して選択

Question

別のモデルにNgForを使用している間に、デフォルトの設定や別のモデルへのリンク方法が見つかりませんか？モデルで（私はすべての可能な組み合わせを試してみた

lengthsObj = [ 
{slot:'Full'}, 
{slot:'Morning'}, 
{slot:'Afternoon'} 
]; 

と：

"Bookings": {"dates": 
[{"date":"3-10-2016","slot":"Full"}, 
{"date":"4-10-2016","slot":"Full"}, 
{"date":"5-10-2016","slot":"Afternoon"}, 
{"date":"6-10-2016","slot":"Morning"}]} 

私はオプションのための別のモデルを持っている：

私がバインドしようとしているモデルがこれです値）私はこれと考えることができます：

<div *ngFor="let date of booking.dates"> 
<select *ngIf="true" name="days" [(ngModel)]="date.slot" required> 
    <option *ngFor="let length of lengthsObj" [value]="date.slot"> 
     {{length.slot}} 
    </option> 
    </select> 
</div> 

しかし、私はモデルまたは任意のデフォルト値へのリンクを取得していません。あなたは以下のようにoption値のためlength.slotを使用する必要が

Here's a plunker

Answer 1

あなたはngValueにdate.slotからデータを割り当てることにより、ミスを犯しました。ちょうどあなたのplunkerにlength.slotにngValueを変更し、それが完璧に動作します：

<select name="days" [(ngModel)]="date.slot" required> 
    <option *ngFor="let length of lengthsObj" [ngValue]="length.slot"> 
     {{length.slot}} 
    </option> 
</select> 

Answer 2

： チェックplnkr

<div *ngFor="let date of booking.dates"> 
    <select *ngIf="true" name="days" [(ngModel)]="date.slot" required> 
    <option *ngFor="let length of lengthsObj" [value]="length.slot"> 
     {{length.slot}} 
    </option> 
    </select> 
</div>