Please enable JavaScript.
Coggle requires JavaScript to display documents.
RxJS (Observables) (Basic Operators (Scan, mergemap, filter(json =>…
RxJS (Observables)
-
Operators
-
-
-
-
.scan(accumulator, value)
//like array.reduce
-
.merge(stream1$, stream2$)
//merges streams, first come first serve
.takeWhile(acc, value)
//returns true or fales
.concat(stream1$, stream2$)
//like merge but stream1$ gets processed, then stream2$ gets processed.
Create
-
-
Observable.fromEvent(document, "mouseMove")
-
Observable.defer(()=>{return observable})
//observable will not execute any code until subscribed, i.e. creates lazy loading of promises, etc.
-
-
Key Concepts
-
-
-
When an observable hits error() or complete(), it will end. To stop this from ending, use mergeMap or switchMap to create an inner obersvable and catch the error.
Work Backwards - What stream do I need, what streams are required to create the stream.
-
-
Subscribe
data$.subscribe(
value=> console.log(value),
error => console.log(error),
()=> console.log('complete');
class myObject implements Observer{
next(value) { function}
error(e) {function}
complete(){ function}
}
data$.subscribe(new myObject);
Angular2 Specific
can either stream$.subscribe or {{let item of stream|async}}
Also, to prevent a null value before a stream has content, use {{stream$?.whatever}}
Error Handling
-
Throw new error != observable.throw(new Error)
first is run time error, the second is observable error which is passed to the subscribe error handler
Obsevable.from().catch(e => fn(return item))
//catches error, returns item in place of error
//this will stop the observable stream after error is caught
-
Angular 2 specifc
{{stream$|async}}
//each time this is called, it sets up a new subscription
to keep all the stream$ as one susbscription, use observable.share() at the end (warning: takes resources, so don't overuse)
pipe async
pro: no subscription mgmt
pro: automatic unsubscription on unmount
cons: encourages overuse of multicasting (i.e. .share())
-