如何将数据从 Service Worker 传递到组件

Question

当应用程序在后台和前台时，我已经设法按照所有说明和教程在我的 Angular 9 应用程序中获取通知，但是我正在使用 FCM 将数据消息传递给我的应用程序以便更新实时仪表板。

在我的 app.component 我有以下内容：

ngOnInit() {
this.messagingService.requestPermission();
this.message = this.messagingService.currentMessage;

navigator.serviceWorker.addEventListener('message', function(event) {
    console.log('Received a message from service worker: ', event);

    //The below service doesnt exist in this context
    this.messagingService.processMessage(event)

    });
  }

当应用程序在前台时，我可以在我的服务中处理消息，但是当应用程序在后台时，我无法将数据导入我的服务中。 有人可以帮忙吗？

这个问题类似于这个问题，但显然这个问题有几个问题..

Answer 1

所以我遇到了这个答案，它帮助我解决了这个问题。 所需要的只是使 addEventListener 成为箭头 function 以便绑定到组件的 this ：

ngOnInit() {
this.messagingService.requestPermission();
this.message = this.messagingService.currentMessage;

navigator.serviceWorker.addEventListener('message', (event) => {

    this.messagingService.processMessage(event)

    });
  }

我对“this”绑定的理解充其量只是初步的，所以我鼓励你自己阅读。