Uno por uno, observables RxJS

Tengo un problema con los observables. He preparado stackblitz para simplificar mi problema.

Tengo 2 observables (obs1$, obs2$) y un arreglo de números.
Quiero esperar a que obs1$ se complete y luego recorrer el arreglo y devolver un observable para cada elemento, ejecutar obs2$.

Aquí está el código de la función:

oneByOneObservables(): Observable<unknown> { const obs1$ = of(1, 2, 3); const arr = [4, 5, 6]; const obs2$ = of(7, 8, 9); return obs1$.pipe( concat(() => arr.map((item) => of(item))), () => obs2$ ); }

Obtengo un error:

No coincide ninguna sobrecarga de esta llamada.
La última sobrecarga ha dado el siguiente error.
El argumento de tipo ‘() => Observable[]’ no es asignable al parámetro de tipo ‘SchedulerLike | ObservableInput‘.
La propiedad ‘[Symbol.iterator]’ falta en el tipo ‘() => Observable[]’ pero es requerida en el tipo ‘Iterable‘.

Gracias por la ayuda.

davy.ai

July 27, 2023 at 9:16 am

Para resolver este problema, puede utilizar el operador concatMap en lugar de concat para concatenar los observables devueltos por arr.map. Esto asegurará que cada observable se ejecute secuencialmente. Además, debe agregar el operador toArray() al final del map para recopilar todos los resultados en un array.

Aquí está el código actualizado:

oneByOneObservables(): Observable<unknown> {
  const obs1$ = of(1, 2, 3);
  const arr = [4, 5, 6];
  const obs2$ = of(7, 8, 9);

  return obs1$.pipe(
    concatMap(() => from(arr).pipe(
      map(item => of(item)),
      concatAll(),
      toArray()
    )),
    concat(() => obs2$)
  );
}

En este código, primero estamos convirtiendo arr en un observable utilizando from. Luego estamos utilizando map para convertir cada item en un observable utilizando of. El operador concatAll se utiliza para ejecutar estos observables secuencialmente. Finalmente, se utiliza toArray para recopilar todos los resultados en un array.

Ahora, puede suscribirse a esta función para obtener los resultados deseados:

this.oneByOneObservables().subscribe(console.log);

Esto mostrará como resultado:

1 2 3 4 5 6 7 8 9

Answer

davy.ai

July 27, 2023 at 9:16 am
Para resolver este problema, puede utilizar el operador concatMap en lugar de concat para concatenar los observables devueltos por arr.map. Esto asegurará que cada observable se ejecute secuencialmente. Además, debe agregar el operador toArray() al final del map para recopilar todos los resultados en un array.

Aquí está el código actualizado:
```
oneByOneObservables(): Observable<unknown> {
  const obs1$ = of(1, 2, 3);
  const arr = [4, 5, 6];
  const obs2$ = of(7, 8, 9);

  return obs1$.pipe(
    concatMap(() => from(arr).pipe(
      map(item => of(item)),
      concatAll(),
      toArray()
    )),
    concat(() => obs2$)
  );
}
```
En este código, primero estamos convirtiendo arr en un observable utilizando from. Luego estamos utilizando map para convertir cada item en un observable utilizando of. El operador concatAll se utiliza para ejecutar estos observables secuencialmente. Finalmente, se utiliza toArray para recopilar todos los resultados en un array.

Ahora, puede suscribirse a esta función para obtener los resultados deseados:
```
this.oneByOneObservables().subscribe(console.log);
```
Esto mostrará como resultado:

1 2 3 4 5 6 7 8 9

Comments are closed.

es.davy.ai

¿Tienes una pregunta?

Uno por uno, observables RxJS

Answer

davy.ai