0

I have a table of values :

var array = [10,11,12,13,14,15]

and I would like to integrate it into an http.get as parameters but in the following form :

id=10&id=11&id=12&id=13&id=14&id=15

I thought of doing the following way :

var url = /myUrl;
var urlParam;
  array.map(function(item) {
  urlParam += '&id=' + item ;
  return urlParam;
 });

but in the end my URL looks like this :

ERRONEOUS

/myUrl&id=10&id=11&id=12&id=13&id=14&id=15

instead of :

/myUrl?id=10&id=11&id=12&id=13&id=14&id=15

for the

$http.get('/myUrl' + urlParam);

is there a better solution ?

Community
  • 1
  • 1
Greg-A
  • 772
  • 1
  • 19
  • 41
  • What backend accepts URL params like that? That is not the de-facto way to specify an array as a URL parameter. – georgeawg Jul 15 '19 at 15:26

3 Answers3

2

You should really use URLSearchParams which is present to work with query strings of the URL.

var array = [10, 11, 12, 13, 14, 15];
const params = new URLSearchParams();

array.forEach(function(value) {
  params.append('id', value);
});

console.log('/myUrl?' + params.toString());

Since the key for the URL query parameters remains the same, it's better to send it as one key multiple values. You could use JSON.stringify() or send the array as is depending upon how you would want to implement it, but sending as JSON would be a better design. 

var array = [10, 11, 12, 13, 14, 15];
const params = new URLSearchParams();
params.append('id', JSON.stringify(array));
console.log('/myUrl?' + params.toString());
nice_dev
  • 17,053
  • 2
  • 21
  • 35
  • A PHP backend will accept multiple entries with the key `id[]` and decode it as an array. The [URLSearchParams](https://developer.mozilla.org/en-US/docs/Web/API/URLSearchParams) API is a robust solution with proper [percent-encoding](https://en.wikipedia.org/wiki/Percent-encoding). – georgeawg Jul 15 '19 at 15:50
  • @georgeawg Yes, but I suggested the JSON way because today every backend technology parses the JSON easily, so the front end would remain the same regardless of the backend tech we use. – nice_dev Jul 15 '19 at 15:54
0

You can map the values in the array to id=${item} then join each item in the array with &. Then just append that value to /myurl?







const array = [10,11,12,13,14,15]
const url = '/myUrl?' + array.map((item) => `id=${item}`).join('&')
console.log(url)

However, you might have another issue.

The url params are invalid. Depending on the server, only the first or last id will be passed in.

You should really do id1=value&id2=value2 so that you can access each one. Better yet, id[]=value&id[]=value2. This should be parsed as an array on the server.

Vitaliy Isikov
  • 3,647
  • 9
  • 38
  • 46
0

From angular documentation you can pass a parameter called params which purpose is passing query params.

Then you can just call your url and pass the params in the config of the request.

You can see multiple example on this feed.

Params is a json object, so you could just pass your array and it should work direclty !

A Le Dref
  • 422
  • 3
  • 7