首页 > 解决方案 > Angular如何保存整个页面或组件数据以供以后使用

问题描述

我有一个 Angular 6 应用程序,它具有使用 @angular/material 水平步进器的不同组件(屏幕),每个步骤都有复杂的表单(模板驱动的表单和表单组),我想将整个步骤保存在草稿中(可能在 localStorage 或mongodb)如果该过程未完成或者用户想要保存以便以后继续,但是所有组件结构都不同,因为它们具有不同的表单组和类成员变量所以我要问的是有什么解决方案可以保存整个带有数据的步进器或整个角度组件,因此当用户想要使用时将继续该过程而不会丢失他/她的数据?

注意:所有组件都有不同的变量,这些变量在表单填写期间会发生变化,有些用于隐藏 app/formControls 的某些部分。

标签: javascriptangularreactjsangular-material2angular-material-stepper

解决方案


您可以使用浏览器网络存储,最新的浏览器现在支持此功能https://www.w3schools.com/html/html5_webstorage.asp如果您要离开页面,您可以随时检查此存储,但使用会话存储必须注意,对于每个新选项卡,如果您需要在整个浏览器上访问数据,即使是其他选项卡,本地存储也将是合适的,否则您也可以使用 cookie 来维护数据并恢复用户输入。


推荐阅读