从 jquery $. ajax 转换成角度 $http

我有一段 jQuery 代码,可以很好地交叉起源:

jQuery.ajax({
url: "http://example.appspot.com/rest/app",
type: "POST",
data: JSON.stringify({"foo":"bar"}),
dataType: "json",
contentType: "application/json; charset=utf-8",
success: function (response) {
console.log("success");
},
error: function (response) {
console.log("failed");
}
});

现在我尝试把它转换成 Angular.js 代码,但是没有成功:

$http({
url: "http://example.appspot.com/rest/app",
dataType: "json",
method: "POST",
data: JSON.stringify({"foo":"bar"}),
headers: {
"Content-Type": "application/json; charset=utf-8"
}
}).success(function(response){
$scope.response = response;
}).error(function(error){
$scope.error = error;
});

感谢你的帮助。

142403 次浏览

AngularJS 调用 $http 的方式如下:

$http({
url: "http://example.appspot.com/rest/app",
method: "POST",
data: {"foo":"bar"}
}).then(function successCallback(response) {
// this callback will be called asynchronously
// when the response is available
$scope.data = response.data;
}, function errorCallback(response) {
// called asynchronously if an error occurs
// or server returns response with an error status.
$scope.error = response.statusText;
});

或者可以使用快捷方法写得更简单:

$http.post("http://example.appspot.com/rest/app", {"foo":"bar"})
.then(successCallback, errorCallback);

需要注意的事情有很多:

  • AngularJS 版本更简洁(特别是使用. post ()方法)
  • AngularJS 将负责将 JS 对象转换为 JSON 字符串和设置头(这些是可定制的)
  • 回调函数分别命名为 successerror(也请注意每个回调函数的参数)-不推荐使用角 v1.5
  • 改用 then函数。
  • 更多的 then使用信息可以找到 给你

上面只是一个简单的示例和一些指针,请务必查看 AngularJS 文档以获得更多信息: http://docs.angularjs.org/api/ng.$http

您可以使用 $. param 来分配数据:

 $http({
url: "http://example.appspot.com/rest/app",
method: "POST",
data: $.param({"foo":"bar"})
}).success(function(data, status, headers, config) {
$scope.data = data;
}).error(function(data, status, headers, config) {
$scope.status = status;
});

看这个 AngularJS + ASP.NET Web API 跨域问题

我们可以通过在 AngularJs 中使用 http 服务来实现 ajax 请求,这有助于从远程服务器读取/加载数据。

$http 服务方法列出如下,

 $http.get()
$http.post()
$http.delete()
$http.head()
$http.jsonp()
$http.patch()
$http.put()

例子之一:

    $http.get("sample.php")
.success(function(response) {
$scope.getting = response.data; // response.data is an array
}).error(){


// Error callback will trigger
});

Http://www.drtuts.com/ajax-requests-angularjs/

你可以这样做:

下载“ angle-post-fix”: “ ^ 0.1.0”

然后在声明角度模块时将‘ httpPostFix’添加到依赖项中。

档号: https://github.com/PabloDeGrote/angular-httppostfix