如何在 Angular apollo 客户端中停止轮询？

Question

我有一个仪表板预览页面，其中各种视觉效果使用 graphql 查询获取数据。我已在查询选项中启用轮询，以继续轮询任何数据更改并在预览中更新它。到目前为止，一切都按预期进行。

问题是，当我更改路线时（例如，我返回管理页面），graphql 轮询不会停止。从阿波罗客户端的角度文档中，我找不到任何可以停止轮询路线更改的内容。有一些有关 apollo 的 React 客户端停止轮询的详细信息here，但我无法理解。

如果有人能告诉我如何停止 Angular 中的 graphql 轮询，那就太好了。

如果需要任何进一步的详细信息，请告诉我。

Answer 1

这可能已经太晚了，无法帮助原始海报，但这就是我所做的。希望它可以帮助其他人。这是针对 Angular 8 的，因此早期版本可能会有所不同。

apollo.watchquery(....) 返回一个 QueryRef 实例。此 QueryRef 实例上的 valueChanges 属性返回我们在视图中使用的查询数据。将返回的 QueryRef 实例存储在您的组件或服务中。然后通过路由导航期间调用的 Angular 组件生命周期挂钩之一调用 stopPolling() - 可能使用 ngOnDestroy。我不需要停止导航轮询，但是当查询显示“稳定”状态时，表明它已“完成”并且将来不会改变。

在我的应用程序中，我有一个运行 graphql 查询的 Angular 服务类。在查询调用中，我有如下代码：

this.my_qRef = this.apollo.watchQuery<any>({
    query: MY_QUERY,
    variables: {
      MY_VARIABLEs: my_variables
    },
    pollInterval: 1000
})
return this.my_qRef.valueChanges

然后，该服务还公开了一个 stopPolling 方法，例如：

stopStatusPolling() {
  this.my_qRef.stopPolling()
}

由于视图组件将服务实例作为私有数据成员，因此只要满足正确的条件，例如，当离开组件时，就可以在其上调用 stopStatusPolling 方法 - 在 ngOnDestroy() 方法/lifecycle-hook 中（或者当轮询查询结果“稳定”并且预计不会改变时）。

Answer 2

这个使用 queryRef 调用 start/stopPolling 方法的解决方案仍然有效吗？也许我实施错了，虽然看起来和你的类似

  queryRef: QueryRef<unknown> = this.scanQueueService.getImagesScanQueue();
  this.queryRef.startPolling(500);