How to Disable Browser Refresh Button in Angular?

In this example, you will learn how to disable refresh button of browser using angular. This article goes in detailed on angular prevent browser refresh. i would like to share with you disable f5 in angular. i would like to show you angular disable browser refresh button. follow bellow step for how to stop page refresh in angular.

Here, i will give you simple example of disable f5 and browser refresh function in angular application. 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.

src/app/app.component.ts

import { Component, OnInit } from '@angular/core';
  
@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent implements OnInit  {
  name = 'Angular';
   
  ngOnInit(){
     window.addEventListener("keyup", disableF5);
     window.addEventListener("keydown", disableF5);
   
    function disableF5(e) {
       if ((e.which || e.keyCode) == 116) e.preventDefault(); 
    };
  }
}

Now you can run and check it.

I hope it can help you...