à partir de jquery $.ajax angulaire $http

J'ai ce bout de code jQuery qui fonctionne parfaitement origine de la croix:

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

Maintenant, je suis tring convertir cette Angular.js code sans succès:

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

Toute aide appréciée.

  • Ne sais pas angular.js mais peut-être faile() est un mauvais nom d'une fonction?
  • trouvé un autre similaires problème stackoverflow.com/questions/11786562/...
  • peut-être trouvé une solution stackoverflow.com/questions/12111936/... besoin de digg profonde...
  • Les OPTIONS de demande sera délivré par un navigateur, il sera transparent pour AngularJS / de votre application. Si l'OPTION succède à la demande initiale (POST/GET/whatever) vont suivre et votre code sera appelé dos de la principale demande pas la première OPTION.
  • Il n'est probablement pas Angulaire de la modification de la méthode de demande pour les OPTIONS. C'est probablement votre navigateur de la vérification pour voir si il peut faire de la SCRO demande. Si vous essayez de faire un appel à un domaine distinct de votre navigateur devra faire une demande d'OPTIONS afin de voir si il est autorisé.
InformationsquelleAutor Endless | 2012-08-26
  1. 200

    La AngularJS de l'appel de $http ressemblerait à:

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

    ou pourrait être écrit de manière encore plus simple en utilisant des méthodes de raccourci:

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

    Il existe un certain nombre de choses à remarquer:

    • AngularJS la version la plus concise (en particulier à l'aide .méthode post ())
    • AngularJS va prendre soin de la conversion d'objets JS en chaîne JSON et la définition des en-têtes (ceux-ci sont personnalisables)
    • Fonctions de rappel sont nommés success et error respectivement (veuillez aussi noter que les paramètres de chaque callback) - Déconseillé dans angulaire v1.5
    • utilisation then fonction de la place.
    • Plus d'info de then d'utilisation peuvent être trouvés ici

    Ci-dessus est juste un exemple rapide et de quelques conseils, assurez-vous de vérifier AngularJS la documentation pour plus d': http://docs.angularjs.org/api/ng.$http

    • Bon à savoir! cependant, je ne pense pas à son client d'erreur, je fais face à, Angulaire changement de la méthode de Demande pour les OPTIONS. je pense que je n'certains serveur trucs du côté de la soutenir
    • Oui, je suppose que vous avez besoin de trier côté serveur problèmes en premier. Ensuite, vous serez en mesure de profiter de toute la puissance de l'angulaire de l' $http sur le côté client. Probablement que vous voyez une des OPTIONS supplémentaires demande depuis AngularJS est d'envoyer plus de / différents en-têtes par rapport à jQuery.
    • REMARQUE: dans le "params:" mais pas "data:" voir stackoverflow.com/questions/13760070/...
    • params et data sont 2 choses différentes: params fin dans l'URL (query string) alors que les données dans le corps de la requête (uniquement pour les types de demande, qui peut effectivement avoir des corps).
    • "Angulaire changement de la méthode de Demande pour les OPTIONS. je pense que je n'certains serveur trucs du côté de la soutenir ", je vais avoir le même problème, ce qui ne angulaire ajouter que jquery ne marche pas?
    InformationsquelleAutor pkozlowski.opensource
  2. 1

    Nous pouvons mettre en œuvre une requête ajax en utilisant le service http dans AngularJs, qui permet de lire/charger des données à partir d'un serveur distant.

    $http méthodes de service sont énumérés ci-dessous,

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

    L'une de l'Exemple: 

        $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/

    InformationsquelleAutor Vijayaragavan
  3. 0

    Vous pouvez utiliser ceci :

    Télécharger "angulaires-post-fix": "^0.1.0"

    Puis "httpPostFix' à vos dépendances, tout en déclarant le module angulaire.

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

    InformationsquelleAutor Tewfik Ghariani
  4. -5

    vous pouvez utiliser $.param pour affecter des données :

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

    regardez ceci : AngularJS + ASP.NET l'API Web de la Croix-Problème de Domaine

    • Juste une remarque que $.param est jQuery, donc vous aurez besoin de jQuery chargé de l'utiliser. Pour un jQuery-gratuit exemple à l'aide de $http transformRequest interceptor, voir pastebin.com/zsn9ASkM
    • Attendez une minute, n'est-ce pas jQuery une dépendance de AngularJS? Vous n'aurez jamais de $http sans jQuery premier cours de chargement.
    • non, jQuery n'est pas une dépendance de AngularJS. $http réfère à la Angulaire $service http composant, rien de jQuery. AngularJS a un "jQuery Lite" disponible pour la manipulation du DOM, mais c'est très limité. À partir de Angulaire de l'élément - Si jQuery est disponible, angulaire.l'élément est un alias de la fonction jQuery. Si jQuery n'est pas disponible, angulaire.élément délégués Angulaire intégré dans le sous-ensemble de jQuery, appelé "jQuery " lite" ou "jqLite."
    InformationsquelleAutor hanane