angulargraphqlapollohasuraapollo-angular

Why is apollo-angular Query returning empty array?


I recently installed and setup apollo-angular, and am having trouble getting data from a query. I've referred to other questions that dealt with similar issues, but they weren't helpful. What I'm certain of is:

I expect to get string values from this query, and wne I log the results of the response data, all I get is an empty array labeleld with the table name. The component code:

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;
      });
  }
}

Solution

  • The issue here was permissions being incorrectly configured, so if you get a similar issue, check your permissions, make sure nested tables are properly joined, etc: I haven't dealt with nested permissions much, so I don't know if there's a more efficient way to solve this, but adding a user_id field to the tables I was querying, and adding the standard "user_id _eq x-hasura-user-id" constraint fixed the problem.