用户离开页面时在angularjs中显示自定义确认框

Question

我的要求是当用户离开页面而不保存表单数据时显示自定义确认框。

我用window.onbeforeunload这个事件显示的是谷歌浏览器相关的预定义确认框。当用户更改任何表单并尝试重新加载，制表符关闭或路由更改时，我想显示$ mdDialog.confirm并要求用户离开页面或保持在同一页面上。我如何制作一个？

Answer 1

出于安全原因，这是不能做到的。您可以在beforeunload event的MDN页面找到更多详细信息。

在过去，您可以返回一个显示给用户的自定义字符串，但是现在甚至可以忽略它。您可以做的最好的方法是指导页面显示您已有的标准对话框。 （并且在某些浏览器和某些场景中，即使该指令也可能被忽略。）

另一种方法是在页面中包含用于离开表单的按钮。虽然这仍然不能阻止用户直接从页面导航，但如果它足够可见，在很多情况下，用户更有可能点击导航，而不是直接导航。它也可以作为被动提醒，表单需要显式保存或取消（当然取决于您的具体细节）。