Angular中FormGroup绑定下拉选项，[selected]不生效求解

问题出在你没有采用Angular响应式表单的标准绑定逻辑，手动设置[selected]会和表单控件的状态管理冲突，同时你获取表单控件值的写法也不正确。正确的做法是通过formControlName将下拉框与FormGroup中的title控件绑定，表单会自动同步选中状态。

修改后的模板代码 #

<form [formGroup]="holidayform">
  <select class="form-control" formControlName="title">
    <option value="Globals">Global</option>
    <option value="Locals">Local</option>
  </select>
</form>

关键说明 #

• 移除手动[selected]属性：Angular响应式表单会通过formControlName自动管理下拉框的选中状态，手动设置[selected]会干扰表单控件的状态同步逻辑。
• 确保值完全匹配：确认patchValue传入的data.title的值，与option标签的value属性内容完全一致（包括大小写、字符串格式），值不匹配会导致无法自动选中。
• 正确获取表单控件值：如果需要在其他场景获取title的值，应该使用holidayform.get('title')?.value，而非holidayform.title（后者不是访问FormGroup控件值的正确方式）。

完成上述修改后，调用patchValue设置title值时，下拉框会自动选中对应的选项。

内容的提问来源于stack exchange，提问作者user3653474