angular - 如何在 Angular 2+ 中使用 HostListener 查找浏览器选项卡是否集中

Question

我想要使用 HostListener 的浏览器选项卡焦点和模糊事件。

Answer 1

首先在你的组件中导入 HostListener

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

然后把这段代码拿到 Tab Focus and Blur Event

export class AppComponent { 

   @HostListener('window:focus', ['$event'])
   onFocus(event: FocusEvent): void {

       // Do something      

   }

   @HostListener('window:blur', ['$event'])
   onBlur(event: FocusEvent): void {

      // Do something

   }

  ........
  .....
}