web-dev-qa-db-ja.com

AngularJSの$ httpサービスを使用してGETリクエストで配列を送信します

_$http_サービスを使用してGETリクエストを送信する必要があります。パラメーターの1つはIDの配列です。 URLは次のようになりますmysite.com/items?id[]=1&id[]=2&id[]=3&id[]=4

私はこのアプローチを試しました

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

しかし、私が取得したURLはmysite.com/items?id=%5B%221%22%2C%222%22%2C%223%22%2C%224%22%5D

AngularがJSON文字列の値を変換しているためです。必要な動作を取得する方法はありますか?

[更新]

JQueryの$.param()を使用したJonathanの提案のおかげで問題を解決しました。

_$http(
  method: 'GET'
  url: '/items?' + $.param({id: ids})
)
_
48
$http(
  method: 'GET',
  url: '/items',
  params: {
    id: JSON.stringify(ids) // ids is [1, 2, 3, 4]
  }
)
60
Saad Ahmed

あなたもできる

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

前述のとおり here 。簡単そうです。

77

jQueryは優れていますが、このためにjQueryを追加する場合は、jQuery以外の方法を使用して貴重なバイトを節約できます。

jQuery以外の方法:

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

サーバーで配列に変換し直します。

例えば。 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
}
10
Varun Nath

これは有効です。バックエンドでデコードするだけです。ほとんどすべてのバックエンド言語には、URIをデコードする方法があります。 Angularがシリアル化する方法が気に入らない場合は、jqueryの$ .param()を試してください。

5
Jonathan Rowny

$ httpParamSerializerまたは$ httpParamSerializerJQLikeを使用できます

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

jQueryのシリアル化メソッドを複製するためにparamSerializerオプションを設定できます

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

IDが多すぎない限り(構成によってはリクエストURLが長すぎる)、次の解決策が機能します...

角度サービス:

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

WebApiコントローラー

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