我最近安装并设置了 apollo-angular,但无法从查询中获取数据。我提到了其他处理类似问题的问题,但它们没有帮助。我可以肯定的是:
- 我已经成功测试了一个查询,所以我知道 Apollo 和 Hasura 正在通信。
- 授权标头通过附加来自 Auth0 的令牌的拦截器将请求附加到 graphql 端点;网络请求选项卡显示 200,除了空数组外,一切看起来都很正常。
- 当我在 Hasura 后端的 Graphiql 工具上使用该查询时,该查询返回预期结果。
- 权限在后端的表上设置,以便可以访问。
- 没有控制台错误或其他反馈可用。
我希望从此查询中获取字符串值,并且我记录了响应数据的结果,我得到的只是一个带有表名的空数组 labeleld。组件代码:
import { Component, OnInit, OnDestroy } from '@angular/core';
import { Apollo } from 'apollo-angular';
import gql from 'graphql-tag';
const getGoal = gql`
query GetGoal($survey_id: String!) {
goals(where: { survey_id: { _eq: $survey_id } }) {
survey_id
goal
}
}
`;
@Component({
selector: 'app-goals',
templateUrl: './goals.component.html',
styleUrls: ['./goals.component.css']
})
export class GoalsComponent implements OnInit {
loading: boolean;
goal: any;
constructor(private apollo: Apollo) {}
ngOnInit() {
this.apollo
.watchQuery<any>({
query: getGoal,
variables: {
survey_id: 'test_survey'
}
})
.valueChanges.subscribe(({ data, loading }) => {
this.loading = loading;
this.goal = data.goals.goal;
});
}
}