GraphQL, требующий, чтобы несколько переменных не работали должным образом с Angular -Apollo - PullRequest
Новая
       110

GraphQL, требующий, чтобы несколько переменных не работали должным образом с Angular -Apollo

0 голосов
/ 14 апреля 2020

Я начну с того, что говорю, я боролся дольше, чем моя гордость хочет признать, и отложил вопрос, потому что я не уверен, насколько ясным я буду; но здесь идет. , ,

Я использую Angular 9 с Apollo- Angular и у меня нет проблем с доступом к запросам GraphQL без переменных или только с одним. Если я добавлю более одного, я абсолютно неудачен. Я создал простой сервис, который позволит мне создавать динамические c запросы, поэтому у меня есть тип для переменных, который выглядит следующим образом: enter image description here

Apollo- Angular клиент смотрит на это как тип, показанный на следующем изображении. Из всего, что я вижу в документации, Apollo- Angular должен быть в состоянии взять любой заданный объект и преобразовать его должным образом для выполнения запроса, но опять же ... Мне еще предстоит сделать это правильно с более чем одной переменной. enter image description here

При вызове запроса это выглядит следующим образом:

enter image description here

Что приводит к следующий вывод в консоли отладки: 

GraphQLQueryVariables {first: 5, order_by: "accountNumber.ASC"}
{"first":5,"order_by":"accountNumber.ASC"}
Error Message Notification: Error: GraphQL error: Variable `$order_by` got invalid value.

С Chrome, это то, что выполняется: enter image description here

Если я копирую точно то же самое, как показано в Chrome на игровую площадку GraphQL возвращается «Переменная не может быть проанализирована. Пожалуйста go в редакторе переменных и исправьте синтаксические проблемы ”

Я часами пытался отправлять различные пути через свойство переменных WatchQuery. Если я попытаюсь отправить несколько переменных в виде строки, используя JSON .stringify, это будет выглядеть следующим образом: Chrome: enter image description here enter image description here

Если я в буквальном смысле сдаю вручную значение stati c, то с самого начала я получаю ту же проблему: «Переменные не могут быть проанализированы…»

enter image description here

Если я запускаю ту же самую вещь на игровой площадке… но просто добавляю кавычки (которые не отображаются в Chrome), я успешен:

enter image description here

Из того, что я вижу, независимо от того, как я отправляю его из свойства переменной Appllo- Angular Query Watch, я не могу заставить его правильно отправлять. ЕДИНСТВЕННОЕ время, которое он отправляет правильно, это если я использую только ОДНУ переменную, и эта переменная оказывается целым числом.

Есть ли альтернативный подход, который я мог бы / должен использовать? Я просто делаю это абсолютно неправильно ??

Мои конкретные вопросы c используют Angular & Apollo- Angular:

  1. Как отправить несколько переменных для запроса GraphQL (сначала, order_by, где, и др c)?
  2. Как отправить несколько элементов в пределах одной из этих переменных (например, "order_by": "customerName.AS C, accountNumber.DES C, startDate.DES C")?

РЕДАКТИРОВАТЬ: Я только что нашел это в GraphQL Specs , который говорит: 

    Variables Are Input Types
    Formal Specification

    For every operation in a document
    For every variable on each operation
    Let variableType be the type of variable
    IsInputType(variableType) must be true
    Variables can only be input types. Objects, unions, and interfaces cannot be used as inputs

Я думаю, это означает, что мне нужно добавить InputType во внутреннем интерфейсе (. net core, EF.core & Hot Chocolate), который будет генерировать тип ввода в схеме. Я еще не понял, но, по крайней мере, дал новый путь к риску.

РЕДАКТИРОВАТЬ: Каждый из моих типов имеет один из них, используемый для переменных (единственное, что изменится, это то, что в скобках «Получить [AVOs] переменные», «[AVO] Sort», «[AVO] Filter» 

export interface GetAVOsVariables {
    order_by?: AVOSort | null;
    first?: any | null;
    last?: any | null;
    after?: string | null;
    before?: string | null;
    where?: AVOFilter | null;
  }

«[x] Sort» - это строка, которая представляет собой: [fieldName]. AS C или [fieldName] .DES C независимо от типа. Фильтр работает аналогично. Я хочу получить наиболее универсальную c, повторно используемую версию, созданную для предотвращения клонирования тех же структур кода, просто для изменения типа name.

EDIT: я смог заставить переменные работать должным образом, написав это таким образом, вместо того, чтобы просто пытаться отправить объект в одну строку: 

this.result = this.apollo.watchQuery<GraphQLResponse>({
    query: gql`${this.query}`,
    variables: {
        first: this.graphRequest.variables.first,
        last: this.graphRequest.variables.last,
        before: this.graphRequest.variables.before,
        after: this.graphRequest.variables.after,
        where: this.graphRequest.variables.where,
        order_by: this.graphRequest.variables.order_by
    } 
  }).valueChanges
    .pipe(map(({data}) => data));
    return this.result;
}
...