窗口的孔隙不使用角度

Question

我正在尝试创建窗口事件侦听器，该侦听器必须在另一个选项卡中侦听事件，在该选项卡中打开了同一应用程序的另一个实例。
一些服务：

public validateItemAgainstServer = (item: EspApplication) => {
    ...
         window.localStorage.setItem('item', "|")
      ...
    });
  }

组件

constructor(private winRef: WindowRef) {
    winRef.nativeWindow.addEventListener('storage', function (e) {
      console.log("storage event occured");
   }, false);
    window.addEventListener('storage', function (e) {
      console.log("storage event occured");
   }, false);
  }

winref

import { Injectable } from '@angular/core';
function _window(): any {
   // return the global native browser window object
   return window;
}
@Injectable()
export class WindowRef {
   get nativeWindow(): any {
      return _window();
   }
}

遗憾的是，未解雇Onstorage事件。是否可以修复此解决方案，或者可能有一些更好的想法，即如何同步两个选项卡？

Answer 1

在此处检查实时示例！

  @HostListener('window:storage')
  onStorageChange() {
    console.log('change...');
  }