Angular 5无法在下拉框中设置选项

Question

我想根据来自数据库的值在下拉框中保留该选项。在.ts文件中，我做了以下内容：

public availList: any = [{'id':0, 'value':'Open'}, {'id':1, 'value':'Closed'}];

在.html，我做了如下：

<select class="form-control" name="monday" id="monday" [ngModel]="user.monday" (ngModelChange)="user.monday = $event" (change)="AvailabilityChange($event.target.value, 'monday')" #monday="ngModel">
  <option *ngFor="let av of availList" [value]="availability.availability">{{av.value}}</option>
</select>

我看到availability.availability的值通过执行{{availability.availability}}返回0但是，我看到在下拉框中，没有选择任何选项。它应该选择“打开”选项。

Answer 1

在您的班级中分配user.monday = 0，因此将在页面加载时选择“打开”。

Answer 2

您创建具有相同值的选项列表，模板应如下所示：

<option *ngFor="let av of availList" [value]="av.id">{{av.value}}</option>

和availability.availability的值应分配给选择的模型 - user.monday