What are pipe and tap methods in Angular tutorial?
AngularAngular Problem Overview
I'm following the tutorial at https://angular.io, and I'm having trouble finding documentation; specifically for the methods pipe
and tap
. I can't find anything on https://angular.io or http://reactivex.io/rxjs/.
My understanding is that pipe
and tap
are both methods of Observable
, which is being imported from RxJS, correct? What are they supposed to do?
Are these methods part of Angular? What do these two methods do?
Angular Solutions
Solution 1 - Angular
You are right, the documentation lacks of those methods. However when I dug into rxjs repository, I found nice comments about tap (too long to paste here) and pipe operators:
/**
* Used to stitch together functional operators into a chain.
* @method pipe
* @return {Observable} the Observable result of all of the operators having
* been called in the order they were passed in.
*
* @example
*
* import { map, filter, scan } from 'rxjs/operators';
*
* Rx.Observable.interval(1000)
* .pipe(
* filter(x => x % 2 === 0),
* map(x => x + x),
* scan((acc, x) => acc + x)
* )
* .subscribe(x => console.log(x))
*/
In brief:
Pipe: Used to stitch together functional operators into a chain. Before we could just do observable.filter().map().scan()
, but since every RxJS operator is a standalone function rather than an Observable's method, we need pipe()
to make a chain of those operators (see example above).
Tap: Can perform side effects with observed data but does not modify the stream in any way. Formerly called do()
. You can think of it as if observable was an array over time, then tap()
would be an equivalent to Array.forEach()
.