wake-up-neo.net

von jquery $ .ajax bis eckig $ http

Ich habe dieses Stück jQuery-Code, das gut funktioniert:

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 möchte ich diesen Code ohne Erfolg in Angular.js-Code 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 geschätzt.

jqueryajaxangularjscross-domainangular-http
118
Endless

Die AngularJS-Methode zum Aufruf 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 mit Hilfe von Shortcut-Methoden noch einfacher 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 der .post () -Methode) 
  • AngularJS kümmert sich darum, JS-Objekte in JSON-String zu konvertieren und Header festzulegen (diese sind anpassbar)
  • Callback-Funktionen werden success und error genannt (bitte beachten Sie auch die Parameter jedes Callbacks) - Deprecated in angle v1.5
  • verwenden Sie stattdessen die Funktion then. 
  • Weitere Informationen zur Verwendung von then finden Sie hier hier

Das obige ist nur ein kurzes Beispiel und einige Hinweise. Weitere Informationen finden Sie in der AngularJS-Dokumentation: http://docs.angularjs.org/api/ng.$http

198
pkozlowski.opensource

Wir können eine Ajax-Anforderung implementieren, indem Sie den http-Dienst in AngularJs verwenden, der das Lesen/Laden von Daten vom Remote-Server unterstützt.

Die $ http-Servicemethoden 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.drtuts.com/ajax-requests-angularjs/

0
Vijayaragavan

Sie können dies verwenden:

Download "angle-post-fix": "^ 0.1.0"

Fügen Sie dann 'httpPostFix' zu Ihren Abhängigkeiten hinzu, während Sie das Winkelmodul deklarieren.

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

0
Tewfik Ghariani