I'm building an angular 2 app (with a Firebase API). I'm using the AngularFire module. I was wondering how I can mix the canActivate
method with the AngularFire auth Observable, and I found this post. The answer is to make the canActivate
method returns an Observable<boolean>
:
canActivate(): Observable<boolean> { return this.auth .take(1) .map((authState: FirebaseAuthState) => !!authState) .do(authenticated => { if (!authenticated) this.router.navigate(['/login']); }); }
It's the first time I see the Observable do
operator, and I can't understand what it really does ? The official doc didnt help me, and I didn't found decent examples.
Can someone bring here some examples of .do()
usage ? And difference with .subscribe()
?
The of Operator is a creation Operator. Creation Operators are functions that create an Observable stream from a source. The of Operator will create an Observable that emits a variable amount of values in sequence, followed by a Completion notification.
The pipe method of the Angular Observable is used to chain multiple operators together. We can use the pipe as a standalone method, which helps us to reuse it at multiple places or as an instance method. In this tutorial, we will take a look at the pipe and learn how to use it in an Angular Application.
There are three types of values an Observable Execution can deliver: "Next" notification: sends a value such as a Number, a String, an Object, etc. "Error" notification: sends a JavaScript Error or exception. "Complete" notification: does not send a value.
RxJS (Reactive Extensions for JavaScript) is a library for reactive programming using observables that makes it easier to compose asynchronous or callback-based code.
Update
Now it's pipe( tap(...), )
instead of do()
Original
.do()
is to execute code for each event. A difference to .map()
is, that the return value of .do()
is ignored and doesn't change what value the subscriber receives.
Now it's pipe( tap(...), )
instead of do()
const source = of(1, 2, 3, 4); source.pipe( tap(val => console.log('I am tap: ',val)), filter(val => val > 2), map(val => val + 1)).subscribe((val) => { console.log('I am subscriber value after filtering: ', val); });
Output:
I am tap: 1 I am tap: 2 I am tap: 3 I am subscriber value after filtering: 4 I am tap: 4 I am subscriber value after filtering: 5
*Tap operator doesn't modify anything, you can say that it is just to view the stream.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With