Wie poste ich URL-codierte Formulardaten mit dem $http-Dienst von AngularJS ohne jQuery?

URL-codierte Formulardaten mit $http ohne jQuery posten

Beim Tätigen von AJAX-Aufrufen mit dem $http-Dienst von AngularJS können beim Senden von Formulardaten, die erforderlich sind, Probleme auftreten URL-Kodierung. Dies kann besonders frustrierend sein für diejenigen, die eine jQuery-freie Lösung suchen.

Problem

Versuche, Formulardaten über den $http-Dienst von Angular mit den folgenden Ansätzen zu senden, haben zu Fehlern geführt:

• Daten: {Benutzername: $scope.userName, Passwort: $scope.password}
• Parameter: {Benutzername: $scope.userName, Passwort: $scope.password}
• Daten: JSON.stringify({Benutzername: $scope.userName, Passwort: $scope.password})

Lösung

Um URL-codierte Formulardaten erfolgreich zu posten, müssen Sie das Datenobjekt in URL-Parameter umwandeln. Laut Ben Nadel serialisiert Angular die ausgehenden Daten standardmäßig als JSON und veröffentlicht sie mit dem Inhaltstyp „application/json“.

Um dieses Verhalten zu ändern und Formulardaten zu veröffentlichen, aktualisieren Sie den Code wie folgt:

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

Dieser Code wandelt das JavaScript-Objekt in eine URL-codierte Zeichenfolge um und ermöglicht so ein erfolgreiches POSTEN von Formulardaten ohne jQuery.

Erweiterte Lösung mit Angular 1.4

Für AngularJS v1.4 und höher bietet die Nutzung der neu hinzugefügten Dienste eine noch einfachere Lösung:

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

Das obige ist der detaillierte Inhalt vonWie poste ich URL-codierte Formulardaten mit dem $http-Dienst von AngularJS ohne jQuery?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!