RouterLink

If we want to use query parameters in HTML, we need a directive RouterLink.

None

Router

If we want to use query parameters in TS we need to inject Router in the constructor from angular/router.

None

The code in HTML and TS is doing the same thing.

Query Params Handling

Angular has a couple of ways to handle query parameters:

"" : Replace current parameters with new parameters. This is the default behavior. "merge" : Merge new parameters with current parameters. "preserve" : Preserve current parameters.

We can specify query handler behavior.

None

Get query parameters

To get query parameters we need to inject ActivatedRoute from angular/router in the constructor then in the constructor or in method ngOnInit, we must make a subscription where we get query parameters.

None

If you need to take a close look at the project here is the link.

Originally published at http://tomorrowmeannever.wordpress.com on July 19, 2022.