angular - 使用 GraphQl 的 Apollo 客户端时如何在 watchQuery 中使用加载属性

Question

所以当我从我的查询中得到响应时，我可以看到有一个加载属性。但我真的不明白为什么他们会把它传下去。因为当你得到响应时，意味着加载完成，因此加载将始终为 false。

有没有一种方法可以使用此加载属性，以便我可以在调用仍在加载时显示一个加载图标？

我在 Angular 2 环境中有以下代码:

public apolloQuery = gql`
    query {
        apolloQuery 
    }`;

const sub = this.apollo.watchQuery<QueryResponse>({
    query: this.apolloQuery 
}).subscribe(data => {
    console.log(data);
    sub.unsubscribe();
});

并且来自数据对象的日志包含我正在谈论的加载属性，它始终为 false。

我知道我可以创建自己的 bool 属性并通过这种方式进行检查，但我只是想知道我是否可以使用 Apollo 提供的内置加载属性？

Answer 1

这是可能的，您需要设置选项notifyOnNetworkStatusChange: true，这在documentation 中有解释。然后使用加载 Prop :

this.querySubscription = this.apollo.watchQuery<any>({
  query: CurrentUserForProfile
  ,notifyOnNetworkStatusChange: true <-- This will make the trick
})
  .valueChanges
  .subscribe(({ data, loading }) => {
    this.loading = loading; <-- now this will change to false at the start of the request
    this.currentUser = data.currentUser;
  });