angular7 - 如何以角度提醒用户刷新

Question

嗨，我想捕捉窗口刷新事件并通过消息提醒用户，但如果用户选择刷新，我想重定向到特定的 URL。请注意，我使用的是 Angular7。

@HostListener("window:beforeunload", ["$event"]) unloadHandler(event: Event) {
    console.log("Processing beforeunload...");
    // Do more processing...
    event.returnValue = false;
}   

好吧，我已经设法发出警报，但是 1.我要自定义对话框中的消息 2.当用户仍然点击重新加载按钮时，我想在点击时路由它。 但是警报是默认的，我不知道如何自定义。 会很感激一些帮助

Answer 1

你能试试这个吗

JavaScript

window.BeforeUnloadEvent = (ev) => {
    let result = confirm("Changes you made may not be saved.");
    if (result) {
        alert("process");
    } else {
        alert("stay on page");
    }
}

编辑::TypeScript

注意:此代码仅在我们使用 f5 刷新时有效。

import { Component, HostListener } from '@angular/core';

@Component({
  selector: 'app-demo',
  templateUrl: './demo.component.html',
  styleUrls: ['./demo.component.css']
})

export class DemoComponent {

  constructor() {
  }

  @HostListener("window:beforeunload", ["$event"]) unloadHandler(event: Event) {
    let result = confirm("Changes you made may not be saved.");
    if (result) {
      // Do more processing...
    }
    event.returnValue = false; // stay on same page
  }
}