Multiple Objects into HttpParams

Question

I have some categories in a formcontrol, I send them in an array of string like this:

[1,4,6]

And that is my actual code:

Answer 1

You can use .append to append values to a parameter and give you the result you are looking for when dealing with an array of values. .set is used to set or replace a value for a parameter. So really you should be doing something more like the following:

let httpParams = new HttpParams()
  .set('title', this.createNewForm.controls['title'].value)
  .set('content', this.createNewForm.controls['content'].value);

categoryIds.forEach(id => {
  httpParams = httpParams.append('categoryId', id);
});

const requestOptions = {
  params: httpParams,
  withCredentials: true
};

---

It's not obvious, but the .append method does not mutate the HttpParams object it was called from but instead returns a new object. This is why we reassign httpParams in the example above. Also, .append can be called without first using .set to set the parameter.