How can I change url parameters in Angular?

Question

For example I have a url /videos/5 which shows page 5 of my videos page. How can I use the Angular router to change to page 3 for example. Is there a way to 'relatively navigate' like without having to pass videos to the url.

Something like:

this.router.navigate([`/${pageNumber}`])

(page number is the number of the page I want to go to like /videos/3)

I looked around but can't find a solution I tried

this.router.navigate([`../${pageNumber}`], { relativeTo: this.activatedRoute.parent })

But it's giving me errors.

How to achieve this with Angular router and relative urls.

NeNaD · Accepted Answer · 2021-08-23 16:49:34Z

3

Yes, you can use relativeTo with instance of ActivatedRoute, like this:

import { ActivatedRoute, Router } from '@angular/router';

...

constructor(
    private router: Router,
    private activatedRoute: ActivatedRoute
) { }

...

this.router.navigate([`../${pageNumber}`], { relativeTo: this.activatedRoute })

answered Aug 23, 2021 at 16:49

NeNaD

20.8k11 gold badges64 silver badges118 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Enrico Over a year ago

That works! I was messing around with the point point slash and relative to but didn't try that combination yet. Thank you :)

Collectives™ on Stack Overflow

How can I change url parameters in Angular?

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related