在 Angular 中以反应形式更改隐藏字段的值

Question

我有一个反应式表单，它具有用于几种不同场景的相同（两个）输入文本字段。 当用户从列表中选择场景选项时，将显示该表单，并使用所选场景的关键字更新该表单中的隐藏字段，例如

<input formControlName="action" type="hidden" value="{{theaction}}">

我的问题是，虽然该字段正在更新（即我可以在显示代码中看到它），但该值在提交时似乎并未绑定到表单（即该字段在到达服务器时为空）。

我在这里缺少什么关于反应式的形式？

谢谢/汤姆

Answer 1

我最近需要在响应式表单（例如 id）上包含信息，这是我的数据模型的某些不应在 UI 上公开的属性。 我为该属性创建了一个FormControl ，它允许我存储和操作该值，但我没有在模板中创建相应的<input> 。 像魅力一样工作。 例如

profileForm = this.fb.group({
  id: [null],                              //hidden field
  firstName: ['', Validators.required],
  lastName: ['']
});

在模板中

<form [formGroup]="profileForm">

  First Name: <input type="text" formControlName="firstName" />

  Last Name:  <input type="text" formControlName="lastName" />

  [...]

</form>