如果使用 ngFor，如何摆脱额外的空白选择选项

【问题标题】：How to get rid off the extra blank select option if using ngFor如果使用 ngFor，如何摆脱额外的空白选择选项
【发布时间】：2017-04-23 05:09:51
【问题描述】：

我正在构建一个选择标记并使用 *ngFor 从一个 select_options 数组中填充其中的选项。但是，它总是在底部创建一个单独的空白选项项。请帮助摆脱它。

例如我有一个选择选项数组： select_options = ['香蕉', '苹果', '橙子'];

    <select>
        <option *ngFor="let fruit of select_options"
            value="fruit">
            {{fruit}}
        <option>
    </select>

【问题讨论】：

【解决方案1】：

这是因为，没有关闭 <option>。试试这个：

<select>
    <option *ngFor="let fruit of select_options"
        value="fruit">
        {{fruit}}
    </option>
</select>

它会起作用，选择默认值试试这个：

<select [(ngModel)]="selectedFruit" name="test">

和

this.selectedFruit = this.select_options[0];

如@Baconbeastnz 所述。

【讨论】：