title: How to prevent page refresh in angular 4
body: <p>I want to prevent page refresh by everywhere.</p>
  
  <p>I tried the code below </p>
  
  <pre><code>import { Component, OnInit } from '@angular/core';
  import { Router } from '@angular/router';
  import { CommonServices } from '../services/common.service'; 
  
  @Component({
    selector: 'app-review-prescription',
    templateUrl: './review-prescription.component.html',
    styleUrls: ['../../assets/css/prescriptionView.css'],
    providers:[
      CommonServices
    ]
  })
  export class ReviewPrescriptionComponent implements OnInit {
      constructor(
          private commonServices:CommonServices,
          private router:Router
          ){}
      ngOnInit(){
        window.onbeforeunload = function(event) {
          return 'By refreshing this page you may lost all data.';
        }
    }
  
  }
  </code></pre>
  
  <p>Tried this on <code>ngOnChanges()</code>, <code>ngOnInit()</code>, <code>ngOnDestroy()</code> even outside the component class(sorry illogical) but nothing works?</p>
  
  <p>I need solution in Angular or JavaScript not in jQuery.</p>
  
  <p>Thanks.</p>