[Angular] Upgrading to RxJS v6

This is just a learning blog post, check out the talk.

 

1. Custom pipeable operators:

Custom pipeable operator is just a high order function which return an observable.

const pow = (p: number) => (source: Observable<number>) => source.pipe(map(n => n ** p ))

source$.pipe(
  filter(x => x > 100),
  pow(3)
).subscribe(x => console.log(x))

 

2. Error handling: Throw error asynclly:

badSource$.subscribe(nextFn. handlerError, completeFn)

 

3. Simpler import:

import {interval, of} from 'rxjs';
import {filter, mergeMap, scan} from 'rxjs/operators';

interval(1000).pipe(
    filter(x => x % 2 === 0),
    mergeMap(x => of(x + 1, x + 2, x + m)),
    scan((s, x) => s +x, 0)
).subscribe(x => console.log(x));

 

4. New operator: throwIfEmpty

const mustClick$ = buttonClick$.pipe(
    takeUntil(this.viewResize$),
    throwIfEmpty(
        () => new Error('user did not click before resize')
    ),
);

 

5. If you want to migration to rxjs v6:

 

6. Update you code automatically: