Сервисы Angular2 и преобразователи маршрутов с GraphQL

Question

Я пытаюсь использовать Angular2 с GraphQL через Apollo-Client. Я следовал за документацией, и все, кажется, работает хорошо. Однако в документации только объясняется, как подключиться к GraphQL из компонентов. Нет информации о том, как использовать службы для вызовов на сервере или, что еще важнее для меня, как использовать преобразователи маршрутов Angular2 с запросом Apollo или watchQuery.

Я нашел решение о том, как переместить эту логику в службу, используя запрос Apollo, и, похоже, он работает, однако я не могу заставить его работать с методом Apollo watchQuery. У кого-нибудь есть идеи по поводу возможного решения?

Или, может быть, мой подход к перемещению вызовов GraphQL к службам и использованию преобразователей неверен, а логику GraphQL просто оставить в компонентах?

Answer 1

Как я уже упоминал в комментарии, я нашел решение для перехода к query's для служб или резольверов, однако все еще не повезло с watchQuery's (но я также обнаружил, что они не являются действительно необходимыми для моего приложения).

Ниже я приведу несколько фрагментов, которые могут оказаться полезными.

Я определяю методы, которые отвечают за выполнение запросов в моем сервисе:

public allItems(): Observable<ApolloQueryResult<Object>> {
  return this.apollo.query({
    query: allItemsQuery
  });
}

куда allItemsQuery постоянная строка запроса:

export const allItemsQuery = gql`
  query allItems {
    items {
      id
      name
    }
  }
`;

Чем в моих резольверах я просто вызываю метод allItems из сервиса:

 public resolve(route: ActivatedRouteSnapshot): Observable<ApolloQueryResult<Object>> | boolean {
   return this.itemsService.allItems ? this.itemsService.allItems() : false;
 }

И извлеките данные о маршруте из моего компонента:

this.activatedRoute.data.subscribe(data: {items: Item[]}) => {
  console.log(items)
}

Конечно, если в настройке конфигурации маршрутизации вызывается с именем items лайк:

{
  path: 'items',
  component: ItemsComponent,
  resolve: {
    items: ItemsResolve
  }
}

Если вы не хотите использовать запросы через распознаватели, вы, конечно, можете вызывать нужные компоненты из компонентов и подписываться на них. Также есть возможность подписаться на сервисы и возвращать простые объекты / массивы вместо Observable<ApolloQueryResult<T>> но из-за подписок / отписок я думаю, что представленное решение более удобно.