AngularJSのGET/POSTデータ送信
AngularJSでサーバ側にデータを送信するときの処理です。
バージョン)
AngularJS 1.3
GETで送信
サーバ側はPHP
myApp = angular.module('myApp', []);
myApp.controller('testCtrl', function($scope, $http) {
var param = {};
param["id"] = "123";
param["name"] = "テスト";
$http({
method: 'GET',
url: 'test.php',
params: param,
}).success(function (data, status, headers, config) {
// 送信OK
}).error(function (data, status, headers, config) {
// 送信NG
});
});
POSTで送信
サーバ側はPHP
myApp = angular.module('myApp', []);
myApp.controller('testCtrl', function($scope, $http) {
var param = {};
param["id"] = "123";
param["name"] = "テスト";
$http({
method: 'POST',
url: 'test.php',
headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
data: $.param(param)
}).success(function (data, status, headers, config) {
// 送信OK
}).error(function (data, status, headers, config) {
// 送信NG
});
});
初めてPOSTでデータを送信する場合、11,12行目で必ずつまづきます。
12行目の$.param()はjQueryのメソッドです。AngularJS 1.4では「$httpParamSerializerJQLike」を使用して対応できそう。(もうすぐリリースされるAngularJS 1.4の機能を先取りチェックしよう)
詳しくは下記の参考リンクを参照。
[追記]
$httpParamSerializerJQLikeを試してみましたが、$.param()と違って、未設定(空文字)の項目はパラメータ自体が送信されませんでした。