如何从Inside Angular 4中收听服务工作者（sw-precache）更新

Question

在SW-Precache demo code中，当“旧内容将被清除并且新内容将被添加到缓存中”时，会有一行记录到控制台。它还在评论中说，现在是让用户知道新内容可用的好时机。

但是，该脚本位于服务工作者注册块中，我位于我的index.html文件（或我的main.ts文件中;我已尝试过两种方式）。但是，我希望从角度组件中收到此更新的通知，因此我可以向用户显示一个不错的通知。

这样做的正确方法是什么？我在main.ts中创建一个observable并在我的组件中导入它，但这会导致循环引用错误。

Answer 1

您可以使用官方的@angular/service-worker软件包，它也可以与Angular CLI很好地集成，而不是自己实现它。它提供了一个Observable，当有更新版本时可以发出值。然后，您可以通知用户，例如显示一个小吃吧。

摘自docs：

constructor(updates: SwUpdate) {
  updates.available.subscribe(event => {
    console.log('current version is', event.current);
    console.log('available version is', event.available);
  });
}