Наблюдаемый - карта / конкат

Question

Я новичок в Observables. У меня есть следующий эффект.

Я бы хотел, чтобы PositionUpdateAction или PositionFailedAction отправлялись до отправки SunriseSunsetAction.

Что происходит, я получаю результат getCurrentPosition (), переданный в последнюю карту в переменной результата, и SunriseSunsetAction отправляется. Ни PositionUpdateAction, ни PositionFailedAction не отправляются.

Полагаю, я бы хотел как-нибудь использовать concat. Я пробовал разные вещи без успеха.

Любая помощь будет оценена.

@Effect()
  position$: Observable<Action> = this.actions$.pipe(
    ofType(ActionType.GetPosition),
    mergeMap(() =>
      fromPromise(this.geo.getCurrentPosition()).pipe(
        map(value => new UiActions.PositionUpdateAction(value)),
        catchError((err) => {
          return of(new UiActions.PositionFailedAction(err));
        })
      ).map(result =>
        new UiActions.SunriseSunsetAction(this.sun.calculateSunriseSunsetWindows(result.payload.lat, result.payload.long))
      )
    )
  );

Answer 1

Я даю общее решение того, чем я понимаю вашу проблему.Общий сценарий состоит в том, что у вас есть какая-то операция, и вы хотите использовать результат для выполнения другой операции.В конце вы хотите, чтобы результат обоих был выдан.

В вашем конкретном сценарии первая операция - это какой-то запрос, а вторая - сопоставление с другим действием.

Решение состоит в использовании *Map(...) (switchMap, mergeMap, ...), чтобы использовать результат первой операции для выполнения второй.Вместо непосредственного возврата наблюдаемой от секунды вы можете использовать concat для выдачи обоих результатов в порядке вашего выбора.Вот общий пример:

const { of, concat } = rxjs;
const { flatMap } = rxjs.operators;

of(1).pipe(
  flatMap((x) => concat(of(x), of(2)))
).subscribe((x) => { console.log(x); })

<script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/6.1.0/rxjs.umd.min.js"></script>

Таким образом, ваш код может выглядеть примерно так:

@Effect()
position$: Observable<Action> = this.actions$.pipe(
  ofType(ActionType.GetPosition),
  mergeMap(() =>
    fromPromise(this.geo.getCurrentPosition()).pipe(
      map(value => new UiActions.PositionUpdateAction(value)),
      flatMap((x) => concat(
        of(x),
        new UiActions.SunriseSunsetAction(this.sun.calculateSunriseSunsetWindows(result.payload.lat, result.payload.long))
      )),
      catchError((err) => {
        return of(new UiActions.PositionFailedAction(err));
      })
    )
  )
);

Поскольку вы используете эффекты, другим решением будет настройка другого эффектаслушать действие PositionUpdateAction.Хотя может превратиться в спагетти ...