AngularJS：在没有 ngModel 的情况下，所选选项在 <select><option> 中不起作用答案

【问题标题】：AngularJS : selected option not working in <select><option> WITHOUT ngModelAngularJS：在没有 ngModel 的情况下，所选选项在 <select><option> 中不起作用
【发布时间】：2021-10-21 06:21:16
【问题描述】：

我的问题是当我在

<select class="form-control" id="status" formControlName="status">
   <option value="" selected>-- Placeholder --</option>
   <option value="{{variable1}}">Text 1</option>
   <option value="{{variable2}}">Text 2</option>
   <option value="{{variable3}}">Text 3</option>
</select>

在最后三个中，如果 value="" 一切正常，但是当我将变量或其他内容放入其中时，默认情况下显示我已经尝试使用 [selected]="true"，使用 selected="false"这三个

任何人都知道如何解决这个问题并在我的组合框上预先选择第一个

【问题讨论】：

假设你的FormGroup是form，你可以像this.form.get('status').setValue(this.variable1);这样在Typescript中预选或者在初始化this.form = this.fb.group({ status: [this.variable1] });中预选
是的，但这不是我的要求，我只想在页面加载时在组合框中写入“--占位符--”。这不是一个真正的价值，因为这个选项被禁用它只是一个占位符文本^^

标签： angular combobox default-value

【解决方案1】：

如果模板中的值设置为null，它就可以工作。即使没有selected 属性。

<form [formGroup]="form">
  <select class="form-control" id="status" formControlName="status">
    <option [value]="null" selected>-- Placeholder --</option>
    <option [value]="variable1">Text 1</option>
  </select>
</form>

this.form = fb.group({
  status: []
});

【讨论】：

就是这样 >