Tap operator in Angular observable

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


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 logs the values of the source observable into the console.

Source Code

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

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 and complete callbacks

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


Read More

Leave a Comment

Your email address will not be published. Required fields are marked *

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

Scroll to Top