How to send data through routing paths in Angular?

Sometimes, we want to send data through routing paths in Angular.

In this article, we’ll look at how to send data through routing paths in Angular.

How to send data through routing paths in Angular?

To send data through routing paths in Angular, we call this.router.navigate with an object in the 2nd argument.

For instance, in the source route component, we write

this.router.navigate(["action-selection"], { state: { example: "bar" } });

in a method.

The data in the 2nd argument will be sent to the destination component.

Then in the destination component, we write

console.log(this.router.getCurrentNavigation().extras.state.example);

to call getCurrentNavigation to get the values from the object we call navigate with.

Conclusion

To send data through routing paths in Angular, we call this.router.navigate with an object in the 2nd argument.