如何处理/阻止浏览器导航或在 angularjs 中重新加载? [英] How to handle / prevent browser navigation or reload in angularjs?

问题描述

我想在我的 Angular 应用中检测用户何时离开或重新加载页面.

I would like to detect in my angular app when a user is navigating away from or reloading a page.

应用程序(使用一些登录过程)然后应该区分它是重新加载的，所以用户不会丢失他的身份验证数据，应用程序应该能够从 localStorage 恢复必要的信息.

App (that uses some login process) should then distinguish that it was re-loaded, so user won't lose his auth data and app should be able to restore then necessary information from localStorage.

请推荐一些处理"浏览器重新加载/导航的最佳技术.

Please suggest some best techniques to "handle" browser reloading / navigation.

推荐答案

您的所有 javascript 和内存变量在重新加载时都会消失.在 js 中，当代码第一次再次运行时，您知道页面已重新加载.

All of your javascript and in memory variables disappear on reload. In js, you know the page was reloaded when the code is running again for the first time.

要处理重新加载本身(包括按 F5)并在重新加载甚至取消之前采取行动，请使用 'beforeunload' 事件.

To handle the reload itself (which includes hitting F5) and to take action before it reloads or even cancel, use 'beforeunload' event.

var windowElement = angular.element($window);
windowElement.on('beforeunload', function (event) {
    // do whatever you want in here before the page unloads.        

    // the following line of code will prevent reload or navigating away.
    event.preventDefault();
});

这篇关于如何处理/阻止浏览器导航或在 angularjs 中重新加载?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！