Angular Reactive forms：如何在提交后重置表单状态并保留值

Question

以 Angular 反应形式。提交成功后如何只重置表单的 状态？

这是过程：

• 从服务结果创建表单和 setValue
• 修改值并提交表单
• 如果表单正确提交给服务，则重置并保留值

如何保持已修改的值并将表单重置为其原始状态。

form.reset() 只是清空表单。但如果我不调用它，状态不会重置，例如我的验证取决于表单状态类（原始、脏、有效等）仍然存在。

原文由 ExaPsa 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

@smnbbrv 的解决方案效果很好。

您还可以将实际表单值提供给 reset() 方法。

鉴于 myReactiveForm 是您组件中的反应形式。成功提交表单后（例如通过调用服务），您可以执行以下操作：

 this.myReactiveForm.reset(this.myReactiveForm.value);

它将重置表单并将“新”表单值设置为与表单相同的值。

这个方法可以在英雄之旅示例 官方 Angular.io 文档 中看到

原文由 BlackHoleGalaxy 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

我使用 补丁值 来清除响应式表单控件。它对我有用。请尝试以下代码。

 onClear() {
   this.formGroup.patchValue({
     fieldName: ''
   });
}

原文由 Kumaresan Perumal 发布，翻译遵循 CC BY-SA 4.0 许可协议