需要graphql代码的帮助。附件是服务代码和组件文件。因为我刚开始使用graphql,所以我没有使用apollo客户端,而只是在HTTP POST调用之上安装一个查询,并向graphql服务器发送请求。另外,我收到一个400坏请求错误,没有任何错误响应对象。
graphi.service.ts
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs';
@Injectable({
providedIn: 'root',
})
export class GraphService {
constructor(private http: HttpClient) {}
fetchTdmData(): Observable<any> {
const endpoint = 'https://grahphqldemo-dit.r3.pcf.dell.com/graphql';
const query = "{n" +
"bankAccount{n" +
" namen" +
" idn" +
" currencyn" +
" }n" +
"}"
return this.http.post(endpoint, query);
}
}
graphi.component.ts
import { Component, OnInit } from '@angular/core';
import { GraphService } from './graphi.service';
@Component({
selector: 'lib-graphi',
templateUrl: './graphi.component.html',
styleUrls: ['./graphi.component.css']
})
export class GraphiComponent implements OnInit {
constructor(private graphService: GraphService) { }
ngOnInit(): void {
this.graphService.fetchTdmData().subscribe((response: any) => {
if(response) {
console.log('graphl Ui success');
console.log(response.data.bankAccount.name);
console.log(response.data.bankAccount.id);
console.log(response.data.bankAccount.currency);
} else {
console.log('graphql UI error');
}
});
}
}
似乎您在请求正文中缺少包装器。每个GraphQL请求都应该包装在query
或mutation
属性中。将body命名为query
是不够的:)
我想正文应该是这样的:
const query = {
query: `{
bankAccount{
name
id
currency
}
}`,
};