如何对数组进行Graphql可观察的响应

编程问答 2022-06-04

问题描述

如何将后弹性响应转换为ng数组？

我来自graphqlclient的查询是：

query MyQuery {
  messages {
    nodes {
      message
    }
  }
}

这是我的回复：（**** let gimsData=client.request(query) *****）

{
  "data": {
    "messages": {
      "nodes": [
        {
          "message": "test "
        },{
          "message": "test2"
        }
      ]
    }
  }
}

在我的page.html 

<ion-card  button *ngFor="let item of (gimsData | async)" >

TypeError：您提供了一个无效的对象，该对象应在其中流。您可以提供一个Observable，Promise，Array或Iterable。

我认为我需要传递（映射）或订阅gimsData。这里很困惑。谢谢

解决方法

您需要在具有 async 管道的位置提供一个Observable。因此，您可以使用 gimsData 制作一个Observable，它将根据您的需要进行工作。

,

我找到了没有管道或地图的解决方案。

import { Component } from '@angular/core';
import { request,gql } from 'graphql-request'
import { Observable,of } from 'rxjs';

const query = gql`
query{allLabels {
  edges {
    node {
      labelName
      labelType
    }
  }
}}
`
export interface labeli {
  labelName: string,labelType: number
}
export interface nodei {
  node: labeli
}
export interface datai {
  allLabels: {
    edges: []
  }
}

@Component({
  selector: 'app-tab1',templateUrl: 'tab1.page.html',styleUrls: ['tab1.page.scss']
})
export class Tab1Page {

  constructor() {
    this.searchgim()
  }
  ea: nodei[];
  dli: labeli[] = [];
  gimResults: Observable<any>;
  async searchgim() {
    console.log("searchgim function entered");
    await request('http://localhost:5000/graphql',query).then(data => {
      let ddatai: datai = data;
      this.ea = ddatai.allLabels.edges;
      this.ea.forEach(element => {
        let eea: labeli
        eea = element.node
        this.dli.push(eea);
      });

      console.log(this.dli);
      this.gimResults = of(this.dli);

    });
  }
}
angularangulargraphqlgraphqlobservableobservablepostgraphiletypescripttypescripttypescript