angular - Apollo-Angular 无法重新获取

Question

我目前正在尝试让apollo-angularGQL 查询在更改 UI 后重新获取其数据，并且在重新获取实际更新 UI 中显示的信息时遇到问题。

目前，我的请求写成

this.pluginQuery = this.$apollo.watchQuery<{ plugins: Plugin[] }>({
      /* eslint-disable */
      query: gql`
        query GetPlugins(
          $where: PluginWhereInput,
          $skip: Int,
          $take: Int,
          $orderBy: PluginOrderByInput
        ) {
          plugins(where: $where, skip: $skip, take: $take, orderBy: $orderBy) {
            name
            description
            githubUrl
            language
            category
          }
        }
      `,
      /* eslint-enable */
      variables: {
        orderBy: {
          name: SortOrder.asc
        },
        where: {
          category: {
            equals: this.categoryKeys[this.linkActive]
          }
        },
        skip: this.skip,
        take: this.take
      }
    });

    this.plugins = this.pluginQuery.valueChanges.pipe(
      map((result) => List(result.data.plugins))
    );  

我的重新获取应该由执行的按钮单击触发

  public async refresh() {
    await this.pluginQuery?.refetch({
      variables: {
        orderBy: {
          name: SortOrder.asc
        },
        where: {
          category: {
            equals: this.categoryKeys[this.linkActive]
          }
        },
        skip: this.skip,
        take: this.take
      }
    });
  }

重新获取的 UI 代码

<li *ngFor="let category of categories; index as idx">
  <a [ngClass]="{ 'is-active': isLinkActive(idx) }"
    (click)="setLinkActive(idx); refresh() ">{{ category }}</a>
</li>

任何有关解决我做错的事情的帮助将不胜感激。