javascript – Angular 2 – 跨多个浏览器窗口的单一服务提供商

我试图在任务完成后提供警报 – 用户当时可能处于多个页面中的任何一个页面.警报应显示在所有页面上.

我正在使用实现BehaviorSubject的服务
我的app.component.ts页面中的提供程序 – 单个实例

在我的app.component.html中,我有两个组件,一个是警报,另一个是触发警报.

<alert></alert>
<submit-service></submit-service>

该服务将发送到呈现警报的警报组件.
这工作正常,但只在提交服务的页面上(而不是任何其他页面) – 提交功能也在警报组件中.

提交服务利用
public emit：BehaviorSubject< model> = new BehaviorSubject(new model());

一旦事件完成,它就会触发this.emit.next(_model);

在警报组件中,我订阅了该事件

ngOnInit(): void {
    this.service.emit.subscribe(data=> {
           this.fireAlert(data);
        }
    });
}

所以我想主要的问题是,如何跨多个页面跨多个实例订阅单个服务？

编辑1

对于模糊性的抱歉,页面我指的是单独的浏览器窗口或选项卡,即window.open

解决方法:

以防其他人遇到同样的问题 – 实际上有一个答案.
使用全局存储事件允许跨所有浏览器选项卡/窗口遍历信息.

在服务中而不是使用BehavIoUrSubject,服务将数据更新或“发送”到本地存储项,使用HostListener()装饰器的事件侦听器可以侦听这些udpates – 它可以侦听所有窗口和选项卡.

例：

    @HostListener('window:storage', ['$event'])
    onStorageChange(ev: StorageEvent) {
       console.log(ev.key);
       console.log(ev.newValue);        
    }

有关详细信息,请参见此处：Storage events