How to use arrays in routes with Angular?

Question

I thought using getAll with a paramMap could help with getting arrays from the URL but apparently not.

Am I using it wrong?

Here's an example : https://stackblitz.com/edit/angular-bjrjz9

I navigate with this

this.router.navigate(['two', {
  id: [1, 2, 3, 4, 5]
}]);

And then I get the values

this.route.paramMap.subscribe(params => {
  const ids = params.getAll('id');
  console.log('ids', ids);
});

console.log says ['1,2,3,4,5'] but I expected it to be [1,2,3,4,5] or even ['1', '2', '3', '4', '5']

I'm just trying to pass an array to a route and then get the array back at the destination.
Of course, I could just split the string but what's the point of having getAll in that case? :)

Answer 1

The getAll() method returns duplicate parameters as an array.

Example:

http://www.example.com/?query=a&query=b&query=c

The value would be:

console.log(params.getAll('query')); // prints ["a","b","c"]

All query parameters in the HTTP specification are strings.