Angular - 选择占位符未显示

Question

这个简单的代码有什么原因不起作用吗？我试图在我的选择中添加一个占位符，但它只是显示为列表中的其他选项之一。

<div *ngFor="let d of formDatiRichiesta" class="form-row">
          <select *ngIf="d.type=='select'" 
                  class="form-control" 
                  name="{{d.name}}" 
                  [(ngModel)]="model[d.name]"
                  required>
            <option selected disabled>{{d.placeholder}}</option>
            <option *ngFor="let b of elencoBanche" value="{{b.id}}">{{b.denominazione}}</option>
          </select>
        </div>

我正在使用angular4. 谢谢。

--编辑--我发现如果我删除 [(ngModel)]="model[d.name]"一切正常。任何提示？

Answer 1

这就是它应该如何工作的。对于该属性，disabled您无法选择它作为选项。

但您可以添加该hidden属性来隐藏它：

<option value="" selected disabled hidden>{{d.placeholder}}</option>

Answer 2

您必须将 的值设置为<option>模型的值，因为<select>将使用模型的值作为默认选择。

当模型在开始时未定义时，您可以这样做：

<option value="undefined">Please choose...</option>