Вызовы API, зависимые от последовательности эффектов NGRX

Question

В настоящее время я работаю над функцией для приложения Angular с использованием NGRX, в котором отправляется действие для получения некоторых данных с использованием Id; затем, используя объект ответа из первого вызова службы, выполняется второй запрос, чтобы получить дополнительные сведения из другой конечной точки. После того, как все будет сделано, данные / действия могут продолжаться. быть неполным.

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

Код выглядит примерно так:

    this.actions$.pipe(
      ofType(fetchAllData),
      switchMap(action => {
        const one = this.api.getById(serviceUrl, action.Id);
        return one.pipe(
          switchMap((data) => {
            cons two = this.api.getMoreDetail(serviceUrl, two.id)
            return fetchDataActions(data, []);
          })
        );
      })
    )
  );  

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

Примечания: - приведенный выше код не работает - вызовы должны происходить по порядку, поскольку ответ от вызова №1 будет использоваться как параметр для вызова № 2 - выполнение упорядоченных отправленных действий не работает, так как данные компонента являются неполными при визуализации.

Answer 1

После switchMap вы можете добавить второй оператор сопоставления, чтобы сделать второй запрос.

Я ищу способ выполнить действия, описанные выше, в одном эффекте, без объединение эффектов / действий в цепочку, так как это приведет к тому, что визуализируемый компонент будет неполным

Это неверно, если эффект не отправляет действие, которое обрабатывается редуктором и вызывает изменение состояния, компонент не будет повторно отображаться. Он будет повторно визуализироваться, только если состояние изменится.

См. Следующую статью, где объясняются некоторые шаблоны эффектов: https://blog.nrwl.io/ngrx-patterns-and-techniques-f46126e2b1e5