Bagaimana untuk Menghantar Data Borang Diekodkan URL dengan $http AngularJS Tanpa jQuery?

Menyerahkan Data Borang Diekodkan Url dengan $http tanpa jQuery

Dalam AngularJS, membuat permintaan AJAX dengan $http ialah tugas yang biasa ditangani. Walau bagaimanapun, menyerahkan data borang berkod url tanpa bergantung pada jQuery boleh menjadi satu cabaran untuk pemula.

Pendekatan Gagal

Pendekatan yang disebutkan, seperti menggunakan data: {username : $scope.userName, kata laluan: $scope.password} atau params: {username: $scope.userName, password: $scope.password}, ​​tidak akan mengekod data dengan betul dalam format url.

Penyelesaian Betul

Untuk mencapai kefungsian yang diingini, perkhidmatan $http Angular menawarkan fungsi transformRequest yang membenarkan transformasi data tersuai sebelum menghantarnya ke pelayan.

$http({
    method: 'POST',
    url: url,
    headers: {'Content-Type': 'application/x-www-form-urlencoded'},
    transformRequest: function(obj) {
        var str = [];
        for(var p in obj)
        str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
        return str.join("&");
    },
    data: {username: $scope.userName, password: $scope.password}
}).then(function () {});

Penyelesaian Dipertingkat (AngularJS V1.4 dan Kemudian)

AngularJS versi 1.4 dan kemudiannya telah memperkenalkan perkhidmatan baharu yang direka khusus untuk parameter pengekodan URL. Menggunakan perkhidmatan ini, proses boleh dipermudahkan lagi:

$http({
    method: 'POST',
    url: url,
    headers: {'Content-Type': 'application/x-www-form-urlencoded'},
    transformRequest: angular.identity,
    params: {username: $scope.userName, password: $scope.password}
}).then(function () {});

Atas ialah kandungan terperinci Bagaimana untuk Menghantar Data Borang Diekodkan URL dengan $http AngularJS Tanpa jQuery?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!