Question

我正在尝试制作一个为用户提供考试的网站。每个人只有15分钟的时间来回答问题。当用户用完时，系统会将结果提交给服务器。但是如果用户关闭浏览器，什么都不会发生。那么，如何在Angular中监听浏览器的关闭事件。

第2部分

我想在用户关闭浏览器或刷新网页时提交结果.Ketan Akbari的回答帮助了我。但还有一个问题。当我刷新网页时，我发现系统没有提交结果。然后我打开萤火虫检查网络并比较刷新和手动之间的区别。

黑暗的是手动的，亮的是刷新的。我猜刷新事件会停止提交的操作吗？

Answer 1

您可以使用：

<强>使用Javascript：

window.onbeforeunload = function (e) {

};

Angular（打字稿）

@HostListener('window:beforeunload', ['$event'])
 beforeunloadHandler(event): void {
  // do whatever....
 }

Answer 2

您可以使用onbeforeunload窗口事件。

Answer 3

尝试将其用于主模板文件

<div (window:beforeunload)="checkSomething()"></div>

OR

@Component({ 
  selector: 'xxx',
  host: {'window:beforeunload':'checkSomething'}
  ..
)}

OR

@Component({ 
  selector: 'xxx',
  ..
)}
class MyComponent {
  @HostListener('window:beforeunload')
  checkSomething() {
  }
}

这是听众的行为。

您仍然可以使用

export class AppComponent {  
  constructor() {
    window.onbeforeunload = function(e) {
      return 'You have some unsaved changes';
    };
  }
}