How do I add query parameters to my url in TypeScript?

Question

After I click on a button, I want to redirect to a different page. So I have the following function:

//this redirects me correctly
click() {
    window.location.href = 'download/' + this.some.string.toLowerCase();
    console.log(this.client.displayName);
  }

However I would like my url to look something like this:

toggleDownload() {
    const someValue = this.client.getValue();
    window.location.href = 'download/' + this.client.displayName.toLowerCase()+'key='+value;
    console.log(this.client.displayName);
  }

If the query parameters are presented, I do something based on this, if not, I don't. Is this the correct way to add query parameters? Do I just append them as string?

Possible duplicate of [How can I add or update a query string parameter?](https://stackoverflow.com/questions/5999118/how-can-i-add-or-update-a-query-string-parameter) — Heretic Monkey, Apr 08 '19 at 14:01
TypeScript compiles to JavaScript; anything you need to do in TypeScript, you can use answers for JavaScript. — Heretic Monkey, Apr 08 '19 at 14:02

jburtondev · Accepted Answer · 2019-04-08T14:04:56.930

1

Use template literals: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals

This will remove the need to manually concatenate the substrings into one, as shown below:

toggleDownload(): void {
    const someValue = this.client.getValue();
    const urlWithParams = `download/${this.client.displayName.toLowerCase()}+key=${value}`;
    window.location.href = urlWithParams;
  }

edited Apr 08 '19 at 14:04

answered Apr 08 '19 at 13:59

jburtondev

1,011
10
16

How do I add query parameters to my url in TypeScript?

1 Answers1