Chrome 的 Angular2 [已选择] 问题

Question

我的值

{
    "level": [
        {
            "name": "Zero Level",
            "value": 0
        },
        {
            "name": "First Level",
            "value": 1
        }
    ]
}

Select 盒子

<select [(ngModel)]="form.cache.level" name="level" required>
    <option
        *ngFor="let levelof myValues.level"
        [selected] ="level.value === 0"
        [value]="level.value">
        {{ level.name }}
    </option>
</select>

尽管 level.value === 0 为真，但它不会在 Chrome 中被选中。（Firefox 和 IE 工作）

作为解决方法，我初始化了：

form.cache.level = 0

但我想知道，为什么它不适用于 Chrome？（这里有一个playground进一步分析）

Answer 1

使用 ngModel 覆盖 selected 属性的行为，因此如果您选择模型，您始终应该设置绑定值而不是尝试使用选项属性修改选择。

它可能在 Firefox/IE 中意外工作。

Chrome 的 Angular2 [已选择] 问题

Angular2 [selected] issue with Chrome

google-chrome

select

angular

html-select

selected