用AngularJS的$http服务通过GET请求发送数组

I need to send a GET request using the $http service. One of the parameters will be an array of ids. The url looks like this one mysite.com/items?id[]=1&id[]=2&id[]=3&id[]=4

我需要使用$http服务发送一个GET请求。其中一个参数是一个ids数组。url看起来像这个mysite.com/items?id[]=1&id[]=2&id[]=3&id[]=4

I tried this approach

我试过这种方法

$http(
  method: 'GET',
  url: '/items',
  params: {
    id: ids // ids is [1, 2, 3, 4]
  }
)

but the url I obain is mysite.com/items?id=%5B%221%22%2C%222%22%2C%223%22%2C%224%22%5D

但是我看到的url是mysite.com/items?

That's Because Angular is converting my value in a JSON string. Is there a way to get the behavior I want?

这是因为，angle将我的值转换为JSON字符串。有什么方法可以得到我想要的行为吗?

[Update]

(更新)

I solved the issue thanks to Jonathan's suggestion using jQuery's $.param().

由于Jonathan使用jQuery $.param()的建议，我解决了这个问题。

$http(
  method: 'GET'
  url: '/items?' + $.param({id: ids})
)

7 个解决方案

#1

$http(
  method: 'GET',
  url: '/items',
  params: {
    id: JSON.stringify(ids) // ids is [1, 2, 3, 4]
  }
)

#2

You can also just do

你也可以这么做

$http(
  method: 'GET',
  url: '/items',
  params: {
    "id[]": ids // ids is [1, 2, 3, 4]
  }
)

as mentioned here. Seems simpler.

如前所述。似乎更简单。

#3

jQuery is great but if your adding jQuery just for this then you could probably do with a non jQuery way and save some precious bytes.

jQuery非常棒，但是如果您只是为此添加jQuery，那么您可以使用非jQuery方法，并保存一些宝贵的字节。

Non jQuery way :

非jQuery道:

$http(
  method: 'GET',
  url: '/items',
  params: {
    id: ids.toString() //convert array into comma separated values
  }
)

On your server convert it back to an array.

在您的服务器上，将它转换回一个数组。

Eg. in php

如。在php中

$ids = explode(',',Input::get('ids'));

//now you can loop through the data like you would through a regular array. 

foreach($ids as $id)
{
 //do something
}

#4

This is valid, just decode it on your backend. Almost all backend languages have a way to decode a URI. If you don't like the way that Angular is serializing it, you can try jquery's $.param().

这是有效的，只要解码后端。几乎所有后端语言都有一种解码URI的方法。如果您不喜欢角度序列化的方式，可以尝试jquery的$.param()。

#5

The paramSerializer option can be set to replicate jQuery's serialization method:

可以将参数化选项设置为复制jQuery的序列化方法:

$http({
  url: myUrl,
  method: 'GET',
  params: myParams,
  paramSerializer: '$httpParamSerializerJQLike'
});

#6

you can use $httpParamSerializer or $httpParamSerializerJQLike

您可以使用$httpParamSerializer或$httpParamSerializerJQLike

$http({
  method: 'GET',
  url: '/items',
  data: $httpParamSerializer({'id':[1,2,3,4]}),
})

#7

As long as you don't have too many ids, which will cause your request url to be too long depending on your configuration, the following solution will work...

只要您没有太多的id，这将导致根据您的配置导致您的请求url太长，下面的解决方案将会工作……

Angular Service:

角服务:

$http.get("website.com/api/items?ids=1&ids=2&ids=3");

WebApi Controller

WebApi控制器

[HttpGet, Route("api/items")]
public IEnumerable<Item> Get([FromUri] string[] ids)
{
}

#1

$http(
  method: 'GET',
  url: '/items',
  params: {
    id: JSON.stringify(ids) // ids is [1, 2, 3, 4]
  }
)

#2