von jquery $ .ajax zu eckigen $ http

Ich habe dieses Stück jQuery-Code, der gut funktioniert Kreuz Ursprung:

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"); } }); 

Jetzt versuche ich dies ohne Erfolg in Angular.js Code zu konvertieren:

 $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; }); 

Jede Hilfe wird geschätzt.

Die AngularJS-Methode zum Aufrufen von $ http würde folgendermaßen aussehen:

 $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; }); 

oder könnte noch einfacher mit Shortcut-Methoden geschrieben werden:

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

Es gibt einige Dinge zu beachten:

  • AngularJS-Version ist prägnanter (insbesondere mit .post () -Methode)
  • AngularJS kümmert sich um die Konvertierung von JS-Objekten in JSON-String und Setting-Header (diese sind anpassbar)
  • Callback-functionen werden als success bzw. error bezeichnet (bitte beachten Sie auch die Parameter jedes Callbacks) – Veraltet in eckiger Version 1.5
  • Verwenden Sie then stattdessen die function.
  • Weitere Informationen zur Verwendung finden Sie hier

Das obige ist nur ein kurzes Beispiel und einige Hinweise, überprüfen Sie die AngularJS Dokumentation für mehr: http://docs.angularjs.org/api/ng.$http

Wir können eine ajax-Anfrage implementieren, indem wir den http-Dienst in AngularJs verwenden, der beim Lesen / Laden von Daten vom entfernten Server hilft.

$ http Service-Methoden sind unten aufgeführt,

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

Eines der Beispiele:

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

http://www.drguts.com/ajax-requests-angularjs/

Sie können dies verwenden:

Download “eckig-nach-fix”: “^ 0.1.0”

Fügen Sie dann ‘httpPostFix’ zu Ihren Abhängigkeiten hinzu, während Sie das angularmodul deklarieren.

Ref: https://github.com/PabloDeGrote/angular-httppostfix

Sie können $ .param verwenden, um Daten zuzuordnen:

  $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; }); 

sieh dir das an: AngularJS + ASP.NET Web API Domainübergreifendes Problem