Angular Prevent Browser Refresh Button Example

In this tutorial, you will learn angular disable browser refresh button. I’m going to show you about how to stop page refresh in angular. In this article, we will implement a how to stop browser refresh button in angular. i explained simply step by step how to disable refresh button of browser using angular. Here, Creating a basic example of angular prevent browser refresh.

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...