Question

我有以下代码：

  <select #typ class="input" (change)="changeIndex(typ.value)">
        <option *ngFor="let creation of creationComponent>{{creation.name}}</option>
  </select>

如果我启动应用程序，则选择已自动选择第一个选项。但我不想要那个。为什么这样，我该如何解决？

Answer 1

在这里找到一个更好的答案： https://stackoverflow.com/a/13492609/5039495

我们可以在默认选项中使用selected，disabled和hidden，这可以通过safari识别。

<select>
  <option selected disabled hidden></option>
  <option>1</option>
  <option>2</option>
</select>

过时

诀窍是使用display:none设置一个空选项。

<select>
  <option style="display:none"></option>
  <option>1</option>
  <option>2</option>
</select>

警告：正如其他用户所报告的那样，此解决方案在Safari和iOS Safari中不起作用

Answer 2

这是常见的事情......只需添加一个空的<option>作为第一个：

<select #typ class="input" (change)="changeIndex(typ.value)">
  <option></option>
  <option *ngFor="let creation of creationComponent>{{creation.name}}</option>
</select>

<select>标记无法取消选择任何内容。这应该解决它。引自Turnip＆＃39; comment：选择必须有一个选定的选项。如果您未使用所选属性明确设置一个属性，则将使用第一个属性。要获得更好的版本，您可以将以下代码与selected属性一起使用：

<select #typ class="input" (change)="changeIndex(typ.value)">
  <option selected="selected" value=""></option>
  <option *ngFor="let creation of creationComponent>{{creation.name}}</option>
</select>

HTML选择自动选择第一个条目

2 个答案: