Question

我试图在第一个“选项”字段为空的地方进行选择，该字段在下拉列表中不可见并且无法选择。

我已经研究了4个小时。我看到了很多工作选项，但事实是它们（或至少我发现的东西）都没有在Safari上运行。

这是我的代码：

<select class="custom-select" formControlName="subindustryName">
<option *ngFor="let subindustry of subIndustries" 
[value]="subindustry.value">{{subindustry.label}}</option>
</select>

我不使用jQuery。

Answer 1

这项工作对您有用吗？您可以为选项设置样式属性并禁用该字段，以使其不再可选。这个问题似乎已经被另一篇文章回答。 default empty option。

<select>
  <option disabled selected value style="display:none"></option>
  <option value="one">one</option>
  <option value="two">three</option>
  
</select>

Answer 2

如果您喜欢使用

      <select>
         <option> Select Option </option> // replace above code with 
         <option value='' selected> Select Option </option>
      </select>

希望这会起作用。

Answer 3

只需添加未定义值的选项即可强制角度选择该值。像下面一样

<select class="custom-select" formControlName="subindustryName">
    <option value="undefined"></option>
    <option *ngFor="let subindustry of subIndustries" 
    [value]="subindustry.value">{{subindustry.label}}</option>
</select>

，如果您不希望它被选中，则在其中添加'disabled'属性。

按评论编辑

因此，无论您粘贴有问题的内容都应该起作用。这是我的代码段，正在运行。.

<div class="form-group">
  <label class="col-md-3 control-label">Gender</label>
    <div class="col-md-3">
      <select id="gender" class="form-control" [(ngModel)]="userModel.gender" name="gender" required >
        <option value="male">Male</option>
        <option value="female">Female</option>
      </select>
    </div>
</div>

只需尝试对“ subindustryName”使用模板驱动的方法并进行检查。

Answer 4

<option disabled selected value>Select Option</option>
<option value="one">one</option>
<option value="two">two</option>

在Safari和Chrome中，默认的禁用选定值为此。

Safari的“选择”上的默认空白选项

4 个答案: