Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

563
Vistas
Multiple Http calls in one @ngrx/effect

I am very confused, and new to @ngrx so please forgive me for not understanding how this is supposed to work.

Let's say I have an effect that is called PlaceOrderEffect

In this effect, I want to process each request in order.

processOrder$ = createEffect(
   ofType(OrderActions.PROCESS_ORDER),
   //here is where i get confused
   concatMap([
      this.service.addCrust(),
      this.service.addTopings(),
      this.service.sendToCook()
      this.service.checkOut()
   ]
)

How can I run these in sequential order and handle the final response?

over 4 years ago · Santiago Trujillo
1 Respuestas
Responde la pregunta

0

concatMap is RxJS operator to be used with pipe, to merge the source observable with the new one returned by concatMap, which is not your case.

I think you can use RxJS concat function to achieve what you're trying to do if the requests don't depend on each other, like the following:

processOrder$ = createEffect(() =>
    this.actions$.pipe(
        ofType(OrderActions.PROCESS_ORDER),
        // here you need to switch and map to the new observable (concat one) returned by switchMapTo operator
        switchMap(({ payload }) =>
            concat(
                this.service.addCrust(),
                this.service.addTopings(),
                this.service.sendToCook(),
                this.service.checkOut()
            )
        )
    )
);

But if each request depends on the previous one, you can use concatMap operator like the following:

processOrder$ = createEffect(() =>
    this.actions$.pipe(
        ofType(OrderActions.PROCESS_ORDER),
        concatMap(({ payload }) => this.service.addCrust(payload)),
        concatMap((response1) => this.service.addTopings(response1)),
        concatMap((response2) => this.service.sendToCook(response2)),
        concatMap((response3) => this.service.checkOut(response3))
    )
);
over 4 years ago · Santiago Trujillo Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda