angular - angular5のngModelにデータをバインドできないドロップダウンのネストされたngFor

Question

class floor = {
    id: number,
    baseId: number,
    floorChild: [{
            id: number,
            name: string
        }
    ]
};

floor[]; として床の配列があります。

データがフェッチされたときにドロップダウンに表示するには、配列 floor[] の各要素の ID をその floorChild の一致する ID にバインドする必要があります。

component.html

<div *ngFor="let floor of floors;let i = index">
<div class="form-group" >
<div class="col-sm-5">
    <label>{{getBaseName(floor.baseId)}}</label>
</div>
<div class="col-sm-5">
<select class="form-control" [(ngModel)]="floors[i].id" name="id">

<option value="0">Unassigned</option>
<option *ngFor="let child of floors[i].floorChild" [value]="child.id"  [selected]="child.id==floors[i].id ? 'selected' : ''">{{child.name}}</option>
</select>
</div>
</div>
</div>

child.id を floor[i].id にバインドして、一致が発生した対応するデータがドロップダウンに表示されるようにする必要があります。

現在、ドロップダウンのすべてに対して未割り当て (値 = "0") が表示されています。