Commit 95b07229 authored by micha's avatar micha
Browse files

progress

parent 9a27759d
# Combination Operators Comparison
As we did quite a lot od technical stuff it's time to relax and do some playful stuff.
Let's see how the combination operators compare to each other. :)
In this exercise we compare the different operators:
- `combineLatest`
......@@ -11,4 +15,12 @@ We exclude `forkJoin` as we will process ongoing streams.
Also, the operators `zipAll` as well as `combineAll` are left out.
We will discuss `All` operators in a different chapter.
Let's take a closer look to the used RxJs functions.
We have 2 different types, operators and creators functions.
The operators of the listed functions always have the following signature:
`(Observable<T>) => (Observable<R>) => Observable<[T, R]>`
In version 7 of RxJS there was a refactoring.
......@@ -3,12 +3,15 @@ import {combineLatest, fromEvent, ReplaySubject, Subscription, zip} from "rxjs";
import {map, shareReplay, startWith, tap, withLatestFrom} from "rxjs/operators";
@Component({
selector: 'withLatestFrom',
template: `<h3>(Solution) withLatestFrom</h3>
selector: 'solution-comparison',
template: `
<h1>(Solution) Comparison combination operators</h1>
<div #box class="box">
<div class="separation">
</div>
<div class="click-area"></div>
<div class="separation"></div>
<div class="click-pos">&nbsp;</div>
<div class="click-result">
combineLatest:
<b>{{clickResultCombine$ | async}}</b>
......
......@@ -3,13 +3,13 @@ import {fromEvent, ReplaySubject, Subscription} from "rxjs";
import {map, tap} from "rxjs/operators";
@Component({
selector: 'withLatestFrom',
template: `<h3>withLatestFrom</h3>
selector: 'comparison',
template: `
<h1>Comparison combination operators</h1>
<div #box class="box">
<div class="click-area"></div>
<div class="separation"></div>
<div class="click-pos">&nbsp;</div>
<div class="click-result">
......
......@@ -4,7 +4,7 @@ import {filter, map, shareReplay, take, withLatestFrom} from 'rxjs/operators';
import { BlogBasicService, BlogPost, toBlogPosts } from 'shared';
@Component({
selector: 'solution-opt-in-updates-basic',
selector: 'solution-with-latest-from',
template: `
<h1>(Solution) with-latest-from</h1>
......
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