angular - NGRX-effekt sendte en ugyldig handling

Jeg prøver å lage en @Effect() for handlingen min. Når jeg kjører handling med typen AuthenticationUserLoad får jeg en feil.

ERROR Error: Effect "AuthenticationEffects.getUser$" dispatched an invalid action: [object Object]

Her er min Effect-kode

    @Effect()
      getUser$ = this.actions$.pipe(
       ofType(AuthenticationUserActions.AuthenticationUserTypes.AuthenticationUserLoad),
       map((action) => {

          return this.authService.getUser().pipe(
            map((user: User) => new AuthenticationUserActions.AuthenticationUserLoadSuccess({user})),
            catchError(error => of(new AuthenticationUserActions.AuthenticationUserLoadFailure({error})))

          );
        })
     );

OPPDATERING

Jeg endret map til switchMap og det fungerer.

 @Effect()
  getUser$ = this.actions$.pipe(
    ofType(AuthenticationUserActions.AuthenticationUserTypes.AuthenticationUserLoad),
    switchMap((action) => {

      return this.authService.getUser().pipe(
        map((user: User) => new AuthenticationUserActions.AuthenticationUserLoadSuccess({user})),
        catchError(error => of(new AuthenticationUserActions.AuthenticationUserLoadFailure({error})))
      );
    })
  );

Kanskje jeg ikke forstår forskjellen mellom map og switchMap.

Svar #1

Operatoren map mapper den nåværende verdien, den bryr seg ikke om det er en observable eller ikke. Mens switchMap eller mergeMap eller concatMap forventer at en callback returnerer en observable verdi, abonnerer på den og emitterer dens verdier.

Derfor når du kaller map, sier du at gjeldende verdi skal omdannes til noe annet.

map(action => return this.authService.getUser()),
// here the value is an observable stream, but not its emits.

når du kaller switchMap sier du at nå vil jeg abonnere på en annen strøm og sende ut verdiene dens. Fordi det er switchMap sier det også at når foreldrestrømmen sender ut (den samme handlingen kommer), kanseller abonnementet på den nåværende understrømmen og abonner på det som en ny kall til this.authService.getUser() returnerer.

switchMap(action => return this.authService.getUser()),
// here the value is an emit from this.authService.getUser() stream.

Svar #2

I mitt tilfelle løste det seg ved å legge til { dispatch: false } i handlingskallet.

getUser$ = createEffect(() => 
    this.actions$.pipe(
        ofType(actionName),
        withLatestFrom(this.store.select('app')),
        switchMap(() => {
            ...
        })
    ), { dispatch: false }
)

Relaterte artikler