如何在没有jQuery的情况下使用$ http发布urlencode表单数据？

Question

我是AngularJS的新手，一开始，我想只使用AngularJS开发一个新的应用程序。

我正在尝试使用$httpAngular应用程序向服务器端进行AJAX调用。

为了发送参数，我尝试了以下操作：

$http({
    method: "post",
    url: URL,
    headers: {'Content-Type': 'application/x-www-form-urlencoded'},
    data: $.param({username: $scope.userName, password: $scope.password})
}).success(function(result){
    console.log(result);
});

这是可行的，但在上也使用jQuery $.param。为了消除对jQuery的依赖，我尝试：

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

但这似乎失败了。然后我尝试了params：

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

但这似乎也失败了。然后我尝试了JSON.stringify：

data: JSON.stringify({username: $scope.userName, password: $scope.password})

我找到了这些可能的答案，但未成功。难道我做错了什么？我敢肯定，AngularJS将提供此功能，但是如何？

Answer 1

我认为您需要做的是将数据从对象转换为JSON参数而不是JSON字符串。

来自Ben Nadel的博客。

默认情况下，$ http服务将通过将数据序列化为JSON然后使用内容类型“ application /
json”将其发布来转换外发请求。当我们想将值作为FORM发布时，我们需要更改序列化算法并使用内容类型“ application / x-www-
form-urlencoded”发布数据。

这里的例子。

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

更新

要使用AngularJS V1.4中添加的新服务，请参阅

• 仅使用AngularJS服务进行URL编码的变量