Angular 如何在刷新/更改页面上保存反应式表单数据？

将用户插入的数据保存为被动形式的最佳解决方案是什么

在我的Angular应用程序中，我有一个步进器，每一步都是一个反应式表单，当表单有效时，用户可以继续下一步或返回到上一步并更改表单值

当用户希望更改购物车内的项目或刷新页面时，会出现问题，因为他在表单中填写了大量信息。在刷新或更改页面后，插入反应表单中的数据将保留在表单中，这将是一件好事

---

那么，哪种方法是最好的呢？我应该使用localstorage、Cookie或其他东西吗？

在这种情况下，使用

localstorage

可以很好地持久化数据。在组件

ngOnInit（）

中，检查

LocalStorage

，如果有相关数据，请填写表单

您可以使用一个

setLocalStorage（）

函数，如果保持每个数据的持久性对您来说非常重要，则该函数将在表单更改事件中调用，如下所示：

应用程序组件.ts

ngOnInit（）{
this.myForm.valueChanges.subscribe（val=>{
这是setLocalStorage（val）；
});
}
setLocalStorage（newValue:any）：无效{
//在此处设置本地存储代码
}

---

否则，您可以在stepper next按钮或表单提交事件或任何所需事件上调用

setLocalStorage（）

。

因此我应该

。在change handler中为每个表单设置
localstorage？创建一个set函数，并在值更改事件
this.myForm.valueChanges.subscribe（）上调用它
如果设置本地存储对您非常重要。否则，您可以在stepper.awesome的next（）按钮上调用它，因为我不知道
form.valueChanges
实际上，我为每个表单使用了这种方法：
this.clienteForm.valueChanges.subscribe（（）=>{localStorage.setItem（'USER_INFO'，JSON.stringify this.clienteForm.value））；}）要将localstorage中保存为json的值设置为Responsive Form，我必须设置每个控件值，或者我可以将整个json对象放入并填充整个表单一次？因为您使用的是ResponsiveForm，当用户输入数据时，控件将自动设置，并且根据更改，您只需设置localstorage。但是您必须使用另一个将在
ngOnInit（）
上调用的
getFromlocalstorage（）
函数，如果用户刷新页面，请检查localstrage并使用
set（）