GraphQL + Apollo错误:未捕获(承诺)

时间:2018-02-20 12:38:05

标签: javascript typescript graphql apollo

我正在尝试通过按钮单击向我的本地graphQL API提交新数据但是我收到错误:错误错误:未捕获(在承诺中):错误:网络错误:http://localhost:4000/graphql的Http失败响应:400 Bad Request。

的想法是,当您按下按钮时,新数据会被提交

  <button type="submit" (click)="onSubmit()" [disabled]="!personForm.valid" id="buttonSubmit" mat-raised-button color="accent"class="floated">Send</button>

onSubmit函数调用

  onSubmit() 
  {
    let id = 5;
    let vorname = 'user';
    let name =  'name';
    let email =  'testt@hotmail.com';
    let status =  'true';
    let activity =  'Office';

    this.apollo.mutate<CreateUserMutationResponse>({
      mutation: CREATE_USER_MUTATION,
      variables: {
        id: id,
        vorname: vorname,
        name: name,
        email: email,
        status: status,
        activity: activity
      }
    }).subscribe((response) => {

    });

    console.log('submitted');

  }

我的types.ts中的突变看起来像这样

export const CREATE_USER_MUTATION = gql`
  mutation CreateUserMutation($id: ID!, $vorname: String!, $name: String!, $email: String!, $status: String!, $activity: String) {
    createUser(id: $id,vorname: $vorname, name: $name, email: $email, status: $status, activity: $activity) {
      id
      vorname
      name
      email
      status
      activity
    }
  }
`;

export interface CreateUserMutationResponse {
  createUser: String;
}

1 个答案:

答案 0 :(得分:1)

当我发现您的问题时,我实际上遇到了同样的问题。很难获得有关此文档的信息,但是this example指导我如何解决此问题。在我将突变包围在try catch statement中之后,它对我有用。 我很确定这样的事情也可以为您解决:

onSubmit() {

  [...]

  try {
    this.$apollo.mutate <CreateUserMutationResponse>({
      mutation: CREATE_USER_MUTATION,
      variables: {
        id: id,
        vorname: vorname,
        name: name,
        email: email,
        status: status,
        activity: activity
       }
     }).subscribe((response) => { });
   } catch (e) {
      console.error(e);
   }

  console.log('submitted');

This page还帮助我首先设置了突变(似乎您已经正确地进行了设置)。