javascript - 在页面刷新时保存 Controller 状态

Question

我正在尝试在我的表单中实现类似 gmail 的将消息保存为草稿功能。

用例:有一个包含某些字段的表单，其中包括一些文本框、一些图像上传等。我的问题是，如果用户在页面刷新时填写了这些值，我如何保留这些值。请记住用户尚未提交页面。如果它已提交，那么我可以从服务器检索值，但是如果没有单击提交按钮，现在如何将值存储在输入框中。

是否应该有一些 api 可以定期保存值，或者是否可以有一些 api 只能在用户即将关闭页面或刷新页面时调用？

我对此一无所知，希望能得到任何指点。

更新:

根据这些建议，我尝试探索一些教程/博客，它们可以展示使用本地存储的 preoper 设计和实现。我发现以下很好的链接:

http://yeoman.io/codelab/local-storage.html https://domantasjovaisas.wordpress.com/2014/09/05/angularjs-saving-global-variable-in-localstorage/

一些疑问:看来我们可以在本地存储中存储 JSON 对象，但是如何为给定用户存储给定对象。

用例:用户可以创建多条消息。我只想保留最后一条未保存也未发送的消息。我该如何设计才能使存储正常工作？对于给定的 userId，我想在本地存储中保留一些数据。将数据库 ID 存储在本地存储中是否安全？

请提出建议

Answer 1

如果您希望支持较旧的浏览器，我建议使用一个对 localStorage 进行抽象并遵循 cookie 的库。使用 JSON.stringify 并将其传递给您的存储服务。如果一台计算机上可能有多个用户，您还可以将用户名附加到 key 。无论如何，这都是一个很好的做法。

示例包括:

• https://github.com/grevory/angular-local-storage
• http://ngmodules.org/modules/ngStorage

您可以 Hook ng-change、监视、事件监听器或按照其他人的建议使用计时器。

更新:您可以在这里找到一个简单的实现，http://scionsoftware.com/Blog/saving-form-state-with-angular-js/

如果您只想按照您的暗示对一个字符串值执行此操作，只需从 JavaScript 中删除 JSON.parse 和 JSON.stringify 部分即可。