Angular router navigate does not update url params for continuous request

Question

I am trying to update query params using router navigate

updateURL(queryParams){
        this.router.navigate(['path], {
            relativeTo: this.route,
            queryParams: queryParams,
            queryParamsHandling: 'merge',
            skipLocationChange: false
        });
}

/** Wont Work 
updateURL(queryParams);
updateURL(queryParams);
updateURL(queryParams);

/** Will Work
updateURL(queryParams);
// wait
updateURL(queryParams);
// wait
updateURL(queryParams)

When sequential calls are made to this method to update URL query params, angular does not update url. How it can be handled so that angular updates url even when sequential calls are made

Indraraj26 · Accepted Answer · 2020-08-20 08:25:10Z

1

from docs it is promise you will have to wait to fire next update

navigate(commands: any[], extras: NavigationExtras = { skipLocationChange: false }): Promise<boolean>

Can you try this

async updateURL(queryParams){
       await this.router.navigate(['path], {
            relativeTo: this.route,
            queryParams: queryParams,
            queryParamsHandling: 'merge',
            skipLocationChange: false
        });
}

async UpdateQueryParam() {
 await updateURL(queryParams);
  await updateURL(queryParams);
  await updateURL(queryParams)
}

answered Aug 20, 2020 at 8:25

Indraraj26

1,9941 gold badge17 silver badges33 bronze badges

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

Collectives™ on Stack Overflow

Angular router navigate does not update url params for continuous request

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related