web-dev-qa-db-fra.com

Comment envoyer plusieurs actions dans ngrx / effect (redux-observable)?

J'utilise Angular 6, ngrx/store. J'ai un tel effet qui est responsable de la mise à jour des choses. Dépend d'une certaine logique, je veux envoyer différentes actions. Quelle est la différence si j'utilise switchMap insted de map?

C'est ce que j'ai essayé mais ça ne marche pas:

 @Effect()
  dispathMultipleActions$ = this.actions$.pipe(
    ofType(ActionTypes.UpdateSomething),
    map(() => {
      const actions: Action[] = [];
      const array = [1, 2, 3, 4, 5];
      array.forEach(item => {
        if (item > 3) {
          actions.Push(new DeleteAction(item));
        } else {
          actions.Push(new ChangeAction(item));
        }
      });
      return actions;
    })
  );
javascriptangulartypescriptngrxngrx-store
7
mr__brainwash

Un effet transforme un flux d'actions, vous avez donc un flux d'actions en entrée et en sortie. Dans votre exemple, vous mappez une action à un tableau d'actions . Un flux de tableaux d'actions n'est pas un type de sortie valide. Vous devez aplatir ce tableau, ce qui signifie que vous n'émettez pas le tableau lui-même dans le flux de sortie mais à la place chacun de ses éléments.

Au lieu de:

input:  --a-------a------>
output: --[b,c]---[b,c]-->

Tu devrais faire:

input:  --a-------a------>
output: --b-c-----b-c-->

Pour aplatir un observable de tableau en observables de chaque élément, vous pouvez utiliser l'un des opérateurs mergeMap, switchMap, exhaustMap. Dans la plupart des cas, mergeMap sera le bon choix. Si vous voulez en savoir plus sur ces opérateurs, jetez un œil à ceci réponse .

@Effect()
register$: Observable<Action> = this.actions$.pipe(
  ofType(AuthActionTypes.REGISTER_REQUEST),
  mergeMap((action: RegisterRequest) => {
    // check for register request success
    return [
      new RegisterSuccess(),
      new LoginRequest(action.payload)
    ]
  })
);
18
Kim Kern