angularjs - 模糊自动保存+“撤消”按钮

Question

我正在写指令，它将像这样：

1. 允许编辑一些文本（使用内容可编辑）
2. 在失去焦点时，它应该将其价值保存到模型（最近观看并保存到数据库）
3. 应该有一个“撤消”按钮可以恢复更改。

我的实现是：http ://plnkr.co/edit/DsWEYQV4j51i4GO6KjSe?p=preview

我唯一的问题是当我按下“撤消”按钮时，DIV 失去焦点（因此触发了“focusout”事件）并且值保存在模型中，因此“撤消”按钮无法恢复其值。

（我单击“撤消”-> 聚焦事件（自动保存）-> 单击事件（？？？无法还原））

我看到的可能的解决方法：

1. 设置模糊超时并在按下“撤消”按钮时取消它。但这很丑，因为用户可以输入值并导航到应用程序的其他部分，因此超时保存不会运行任何 $watch 侦听器。
2. 保存焦点上的值并在保存“撤消”按钮时恢复它。这会导致另一个问题：$watch 侦听器将以更改的值运行，然后以以前的值再次运行（因此将有 2 次写入 DB 而不是 1 次）

有没有人有这种行为的解决方案（模糊+撤消按钮自动保存）？

Answer 1

如何使用 underscore.js debounce 功能或类似功能导致自动保存延迟，它将检查撤消标志并取消？不确定 $watch 听众在做什么。当然，如果用户完全退出应用程序或刷新页面等，它仍然无法正常工作。