Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Angularjs: capture the refresh event in the browser

In angularjs is possible handle the user clicking the Refresh button on the browser? There is any method that the framework expose to the developer?

Thanks

like image 836
Tom Avatar asked May 28 '14 12:05

Tom


People also ask

How to detect browser refresh event in Angularjs?

If you want to detect the browser refresh with Angular, i will show you a simple way to do it. You need to look at the Angular Router. Specifically to the navigated property. This property is false when the router starts and after the first navigation it changes to true .

How to identify refresh in Angular?

Each time the resolver is resolved is equal to a page refresh in the browser. const routes: Routes = [ { path: '', component: TopComponent, resolve: { loaded: PageLoadedResolver }, children: [ ... ] } ]; There are many other ways of detecting a page load event in Angular. The constructor of your AppModule .

How do I stop Angular refresh?

we will use window keyup and window keydown event to prevent browser page refresh in angular app. You can easily prevent browser refresh in angular 7, angular 8, angular 8 and angular 9 application. Now you can run and check it.


1 Answers

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 Something

   //After this will prevent reload or navigating away.
   event.preventDefault();
});
like image 134
gtzinos Avatar answered Oct 20 '22 19:10

gtzinos