OnChange模型到多个元素

Question

使用window:beforeunload关闭制表符时，我尝试创建指令 @HostListener可以正常工作。

现在我要检查是否更改了某些元素（输入/列表/数组...）

我知道我可以将onModelChange与(change)一起使用

但是，我正在寻找某种通用方式（我的意思是不要将change()放入每个DOM）

我曾经尝试过onChange的救生钩，但没有成功。

Here is stackblitz example

我的指令如下所示（@input必须是标志，以防某些更改）

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

@Directive({
  selector: '[appPageClose]'
})
export class PageCloseDirective {

  @Input ('hasChanges') hasChanges:boolean;

  constructor(){}

  @HostListener('window:beforeunload', ['$event'])
  confirm($event) {
    if(this.hasChanges) 
       $event.returnValue= "do you want to leave?";
  }

}

我的问题是如何为更改创建全局侦听器。