如何在 angular apollo 客户端中停止轮询？答案

【问题标题】：How to stop polling in angular apollo client?如何在 angular apollo 客户端中停止轮询？
【发布时间】：2019-12-15 19:57:18
【问题描述】：

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

问题是当我改变路线时（比如我回到管理页面），graphql 轮询并没有停止。从 apollo client for angular 的文档中，我找不到任何可以停止对路由更改进行轮询的内容。阿波罗的反应客户端停止轮询here 有一些细节，但我无法理解。

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

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

【问题讨论】：

标签： angular polling apollo-client

【解决方案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() 方法/生命周期中 -钩子（或者当轮询查询结果“稳定”并且预计不会改变时）。

【讨论】：