Ngxs - правильный способ потребления API? - PullRequest
Новая
       53

Ngxs - правильный способ потребления API?

0 голосов
/ 25 октября 2018

Я хочу иметь 3 действия для вызова API.GetItem, GetItemFailed, GetItemSuccess.

Я не очень знаком с операторами rxjs, поэтому я использую подписку только для вызовов API.

Примерно так: 

@Action(GetItem)
getItem(sc: StateContext<ItemStateModel>, { payload }: GetItem) {
  sc.patchState({
    isLoading: true
  });

  this.itemService.getItem(payload)
    .subscribe(item => {
      sc.dispatch(new GetItemSuccess(item));
    }, error => {
      sc.dispatch(new GetItemFailed(error));
    });
}

Iвыполнил несколько примеров поиска в Google ngxs и выяснил, что большинство людей используют pipe с помощью tap / take / first, поэтому я реорганизовал подписку в своем действии примерно так: 

  return this.itemService.getItem(payload).pipe(
    tap(({ item }) => {
       return sc.dispatch(new GetItemSuccess(item));
    }),
    catchError(({ error }) => {
      return sc.dispatch(new GetItemFailed(error));
    })
  );

Это сработало, но когда я проверял* инструменты для создания резервных копий GetItemSucess запускается в первую очередь перед GetItem.

Может кто-нибудь показать мне правильный способ вызова API в действии с успехом / неудачей.Не могу найти хороший пример в Интернете.

1 Ответ

0 голосов
/ 29 октября 2018

В NGXS есть открытая проблема , касающаяся порядка действий в инструментах разработчика Redux - подозреваю, что это то, что вы видите.

...