Question

我开发了角形的反应形式

选择下拉列表===> [id] = 1、2、3 ...等

输入文字===>名称：.....

输入文字===>地址：.....

输入文字===>说明：.....

我通过基于ngOnInit和选择下拉列表上的（更改）处理程序中的选定ID调用http get服务来填充表单

我有两个按钮：“验证”和“取消”修改

用户可以修改输入数据值，并在单击验证按钮时保存修改。

取消用户所做的修改的最佳方法是什么？

Answer 1

使用反应式表单时，您的对象值未绑定到表单，因此用户所做的任何更改都不会修改原始对象。

您可以使用以下代码将现有对象中的值复制回表单值上：

// Update the data on the form
this.productForm.patchValue({
  productName: this.product.productName,
  productCode: this.product.productCode,
  starRating: this.product.starRating,
  description: this.product.description
});

更新

我认为您当前的流程是这样：

1）在ngOnInit中，检索数据并将其存储在属性中，例如上面代码中显示的product。

2）然后，使用与上面类似的代码填充表单。

当用户进行更改时，对原始属性（在此示例中为product）所做的更改不是。而是将它们用于由FormGroup定义的表单模型。

因此，您所需要做的就是重复第2步中的代码以取消任何更改，并使表单返回到用户进行任何更新之前的状态。

这有意义吗？

Answer 2

在窗体控件中有一个用角度重置的方法：

reset(value?: any, options?: {
    onlySelf?: boolean;
    emitEvent?: boolean;
}): void;

示例

class Component {
  form: FormGroup;

  resetForm() {
    this.form.reset();
  }
}

重置角反应形式的更改

2 个答案: