Commit 69188be0 authored by micha's avatar micha
Browse files

progress

parent fd4a82f1
# Combining ongoing Observables - Solution
## Combining ongoing Observables
Combining the http calls with the `combineLatest` operator:
**Component**
......
......@@ -2,16 +2,18 @@
This exercise is about combining data coming from multiple HTTP Endpoints into one single set of data.
Combination operators or creation functions enable us to process emissions
from different `Observables` and transform them into a single emission while keeping the original order of events.
from different `Observables` and transform them into a single emission.
The resulting value is an array with the last emitted value of all included Observables.
In this very example we will utilize the `forkJoin` operator.
On first sight it is a perfect match for combining HTTP Endpoints since it waits until all
On first sight it is a perfect match for combining HTTP Requests since it waits until all
combined operators `complete` before emitting a result.
## Example
The below example showcases a very simple example using the `forkJoin` operator. We make use of the `of` creation function
since it emits and completes instantly.
The below example showcases a very simple case using the `forkJoin` operator.
We make use of the `of` creation function (passing a singe value), as its emission pattern is very similar to an HTTP request.
It emits one single value and completes.
```Typescript
import {forkJoin, of} from 'rxjs';
......@@ -30,6 +32,12 @@ The visual representation of the above example:
![forkJoin http calls](./assets/images/Reactive-architecture-and-ux-patterns_angular_combination-operators-forkJoin-http_michael-hladky.png)
The gray boxes at the bottom of the operator scope symbolize a cache which stores the last emitted value of each included Observable.
If any of the sources raises an `error`, it gets forwarded, and the resulting Observable errors.
![forkJoin error](./assets/images/Reactive-architecture-and-ux-patterns_angular_combination-operators-forkJoin-error_michael-hladky.png)
## Gotcha(s)!
As stated above, the `forkJoin` creation function waits until every source raises a `complete` event. After that it will return
......@@ -43,7 +51,3 @@ As stated above, the `forkJoin` creation function waits until every source raise
Here you can see how `forkJoin` will never emit any value, because `a$` does not `complete`.
![forkJoin no emission if not all complete](./assets/images/Reactive-architecture-and-ux-patterns_angular_combination-operators-forkJoin-emit-after-all-complete_michael-hladky.png)
If any of the sources raises an `error`, the result of `forkJoin` will only be the `error`.
![forkJoin error](./assets/images/Reactive-architecture-and-ux-patterns_angular_combination-operators-forkJoin-error_michael-hladky.png)
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment