Tap operator in Angular observable

The Angular Tap RxJs operator returns an observable that is identical to the source. It does not modify the stream in any way. Tap operator is useful for logging the value, debugging the stream for the correct values, or perform any other side effects.

Syntax

Tap Operator Example

In the following example, we create an observable using the of operator. We use the pipe to chain the tap operator, which just logs the values of the source observable into the console.

Source Code

if we simply pass the console.log function to the tap operator and the results will be same.

Tap does not modify the source observable in any way

For Example changing the source any way in the tap operator as in the example below, will have no effect.

Debugging the Observable

One of the use cases for the tap operator is using it to debug the Observable for the correct values.

The map operator in the following example, adds 5 to the source observable. To debug it, we can add the two tap operators. One before and one after it and inspect the values.

Source Code

Error & Complete callbacks

We can also use the tap operator to log the error and complete callbacks as shown in the example below.

Reference

Read More

Leave a Comment

Your email address will not be published.

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Scroll to Top