css - Angular - 选择选项卡时重新加载页面？

Question

当用户单击我的 Angular 应用程序的浏览器选项卡时，有没有办法触发重新加载页面的功能？

我相信这可以通过 window.location.reload() 来完成，但我不确定如何在选项卡选择时触发这一行。

我认为这可以通过使 body/html 具有“onfocus='reloadPage()'”属性来完成，但我不希望它在我移动鼠标时刷新 500 次页面，当标签被聚焦/点击时只有一次。

Answer 1

我喜欢@enjoibp3 解决方案，但不是添加和删除事件监听器。你最好使用 @HostListener (docs)

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

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html'
})
export class AppComponent {
  @HostListener('window:focus') onFocus() {
    console.log('window focus');

    window.location.reload();
  }
}

查看 stackblitz 代码示例 here和演示元素here