Как я могу вернуть несколько действий от вложенного оператора rxjs - PullRequest
Новая
       65

Как я могу вернуть несколько действий от вложенного оператора rxjs

0 голосов
/ 21 октября 2019

У меня проблемы с отправкой нескольких действий в следующем эффекте: 

    @Effect()
    someEffect$ = this.actions$.pipe(
      ofType(someAction: Actions),
      mergeMap(
        (action)=>{
          return this.authService.getProfile(action.payload.authInfo).pipe(
              map((response: any) => {

                  if (response.isErrorResponse) {
                    return new HeaderActions.AuthFail(response);
                  } else {

                 //here i'd like to return multiple actions
                    return [
                      new HeaderActions.FetchMPInfoSuccess(this.fetchMpInfoSuccesState(getMpProfileResponse)),
                      new HeaderActions.GetAccountStates(true)
                  ]
                  }
              }),
              catchError((error:HttpErrorResponse )=>{
                return of(new HeaderActions.AuthFail(response));
              })
            );
        }
      )
    );

Я попытался добавить массив действий в блоке возврата, но это выдает ошибку, что я не отправляюдопустимое действие, есть идеи, что я делаю не так?

Ответы [ 2 ]

3 голосов
/ 24 октября 2019

Вы можете использовать switchMap вместо mergeMap . Затем используйте flatMap или switchMap вместо map .

Код должен выглядеть следующим образом: 

@Effect()
someEffect$ = this.actions$.pipe(
  ofType(someAction: Actions),
  switchMap(
    (action)=>{
      return this.authService.getProfile(action.payload.authInfo).pipe(
          flatMap((response: any) => {

              if (response.isErrorResponse) {
                return new HeaderActions.AuthFail(response);
              } else {

             //here i'd like to return multiple actions
                return [
                  new HeaderActions.FetchMPInfoSuccess(this.fetchMpInfoSuccesState(getMpProfileResponse)),
                  new HeaderActions.GetAccountStates(true)
              ]
              }
          }),
          catchError((error:HttpErrorResponse )=>{
            return of(new HeaderActions.AuthFail(response));
          })
        );
    }
  )
);

Для доступа к данным в вашем дочернем компоненте вы можете использовать этот подход с @Input () set stuff: 

@Input() set(data: any) {
if (data) { console.log(data) }}

Данные в формате htmlбудет там всегда.

Карта изменяет каждый элемент, испускаемый наблюдаемой источником, и испускает измененный элемент.

FlatMap , SwitchMap также применяет функцию к каждому испускаемому элементу, но вместо того, чтобы возвращать измененный элемент, он возвращает саму Observable, которая может выдавать данные снова.

FlatMap объединяет элементы, испускаемые несколькими Observables ивозвращает один наблюдаемый.

SwitchMap немного отличается от FlatMap. SwitchMap отписывается от предыдущего источника Наблюдаемый всякий раз, когда новый элемент начал излучать, таким образом, всегда излучая элементы из текущего Observable.

Если вы хотите узнать больше об операторах rxjs, пожалуйста, посмотрите здесь .

0 голосов
/ 22 октября 2019

Попробуйте: 


@Effect()
    someEffect$ = this.actions$.pipe(
      ofType(someAction: Actions),
      switchMap(
        (action)=>{
          return this.authService.getProfile(action.payload.authInfo).pipe(
              map((response: any) => {

                  if (response.isErrorResponse) {
                    return [new HeaderActions.AuthFail(response)];
                  } else {

                 //here i'd like to return multiple actions
                    return [
                      new HeaderActions.FetchMPInfoSuccess(this.fetchMpInfoSuccesState(getMpProfileResponse)),
                      new HeaderActions.GetAccountStates(true)
                  ]
                  }
              }),
              catchError((error:HttpErrorResponse )=>{
                return of(new HeaderActions.AuthFail(response));
              })
            );
        }
      )
    );

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

Причина, по которой я изменил ее с mergeMap, была: вы возвращаете значение только из одного потока.

...