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

Question

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

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

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

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

Answer 1

这对发帖人来说可能来不及了，但这就是我所做的。希望它可以帮助其他人。这是针对 Angular 8 的，因此可能因早期版本而异。

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

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

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() method/lifecycle-hook（或轮询查询结果'stabilizes'且预计不会改变时）。

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

How to stop polling in angular apollo client?

polling

apollo-client

angular