Comment publier des données de formulaire codées en URL avec le service $http d'AngularJS sans jQuery ?

POSTing de données de formulaire codées en URL avec $http sans jQuery

Lorsque vous effectuez des appels AJAX à l'aide du service $http d'AngularJS, vous pouvez rencontrer des difficultés lors de l'envoi de données de formulaire qui nécessitent Encodage d'URL. Cela peut être particulièrement frustrant pour ceux qui recherchent une solution sans jQuery.

Problème

Les tentatives d'envoi de données de formulaire à l'aide du service $http d'Angular avec les approches suivantes ont abouti à des échecs :

• données : {nom d'utilisateur : $scope.userName, mot de passe : $scope.password}
• params : {nom d'utilisateur : $scope.userName, mot de passe : $scope.password}
• données : JSON.stringify({nom d'utilisateur : $scope.userName, mot de passe : $scope.password})

Solution

Pour POST avec succès les données de formulaire codées en URL, vous avez besoin pour transformer l'objet de données en paramètres d'URL. Selon Ben Nadel, Angular sérialise par défaut les données sortantes au format JSON et les publie avec le type de contenu "application/json".

Pour modifier ce comportement et publier les données du formulaire, mettez à jour le code comme suit :

data: {username: $scope.userName, password: $scope.password}

transformRequest: function(obj) {
    var str = [];
    for(var p in obj)
    str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
    return str.join("&");
},

Ce code convertit l'objet JavaScript en une chaîne codée en URL, permettant un POSTing réussi des données de formulaire sans jQuery.

Solution améliorée avec Angular 1.4

Pour AngularJS v1.4 et versions ultérieures, l'utilisation des services nouvellement ajoutés offre une solution encore plus simple :

data: {username: $scope.userName, password: $scope.password},
headers: {
    'Content-Type': 'application/x-www-form-urlencoded'
}

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!