122

我有这段 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;
});

任何帮助表示赞赏。

4

4 回答 4

202

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 字符串并设置标题（这些是可定制的）
  • 回调函数分别被命名（success也error请注意每个回调的参数） - 在 Angular v1.5 中已弃用
  • 改用then函数。
  • 更多then使用信息可以在这里找到

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

于 2012-08-26T16:40:49.257 回答
1

我们可以在 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/

于 2016-09-16T14:32:09.483 回答
0

你可以使用这个：

下载“角后修复”：“^0.1.0”

然后在声明 Angular 模块时将“httpPostFix”添加到您的依赖项中。

参考：https ://github.com/PabloDeGrote/angular-httppostfix

于 2017-03-30T10:08:49.900 回答
-5

您可以使用 $.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 跨域问题

于 2014-03-11T16:31:29.517 回答