How to hide empty or undefined query parameters in angular 2?

Question

I'm using Angular2 (RC2) and the new Router (Alpaha.8) How can I stop a query param showing in the URL if it is undefined? Eg.

this.router.navigate(["/results", this.month, this.day],
    {
       queryParams: {
          adults: +this.adults
    }
});

Sometimes adults may have a value and other times it may not which is when I don't want to show it.

Günter Zöchbauer · Accepted Answer · 2016-06-28 06:59:30Z

1

I don't think there is another way than just not to add them when they are undefined:

let queryParams:any = {};
if(this.adults) queryParams.adults = this.adults;

this.router.navigate(["/results", this.month, this.day],
    {
       queryParams: queryParams
    }
});

edited Jun 28, 2016 at 6:59

answered Jun 28, 2016 at 6:34

Günter Zöchbauer

661k235 gold badges2.1k silver badges1.6k bronze badges

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

1 Comment

MattDaniell Over a year ago

I added let queryParams: any = {};

ben92 · Accepted Answer · 2022-01-14 16:18:38Z

0

let queryParams = { paramToAdd: "newValue", paramToRemove: undefined };

router.navigate(['.'], { queryParams, queryParamsHandling: "merge", relativeTo: this.route.parent })

answered Jan 14, 2022 at 16:18

ben92

1001 silver badge8 bronze badges

Collectives™ on Stack Overflow

How to hide empty or undefined query parameters in angular 2?

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related