Angularjs $ http没有将表单数据发送到服务器

时间:2013-09-28 07:04:05

标签: javascript angularjs angular-http

如果我使用jquery ajax但以下代码有效,但Angular的$http不会使用以下代码向服务器发送任何数据:

myapp.factory('startCampFactory',function($http,$q,$rootScope){
  return {
    startNewCampaign : function(){

      var e = $("input#email");
      var email = e.val();
      var campname = $("input#campaignname").val();
      var about = $("textarea#about").val();
      var tamt = $("input#targetamount").val();
      var edate = $("input#enddate").val();
      var invitees = $("input#invitees").val();
      var file_data = $("#file").prop("files")[0];
      var form_data = new FormData();     

      form_data.append("file",file_data);
      form_data.append("email",email);
      form_data.append("campaignname",campname);
      form_data.append("about",about);
      form_data.append("targetamount",tamt);
      form_data.append("enddate",edate);
      form_data.append("invitees",invitees);

      console.log(email+about+campname);

      var deferred = $q.defer();

      $http({
           method:'POST',
           url:'/startcampaign',
           data:form_data,
           headers:
             {
               'Content-Type'​ :'application/x-www-form-urlencoded'
             }
        }).success(function(data,status,headers,config) { 
          $rootScope.$apply( function() { 
          deferred.resolve(); 
        });
     }).error(function(){
        $rootScope.$apply(function() 
          { 
            deferred.reject();
          }); 
     });
     return deferred.promise;
   }
});

4 个答案:

答案 0 :(得分:2)

尝试这样的事情:

.service('fileUpload', ['$http', function ($http) {
  this.uploadFileToUrl = function(file, uploadUrl){
    var fd = new FormData();
    fd.append('file', file);
    $http.post(uploadUrl, fd, {
        transformRequest: angular.identity,
        headers: {'Content-Type': undefined}
    })
    .success(function(){
    })
    .error(function(){
    });
  }
}]);

请参阅此链接以获取解释:

http://uncorkedstudios.com/blog/multipartformdata-file-upload-with-angularjs

答案 1 :(得分:0)

我也没有运气,最后使用jQuery.ajax(尽管我使用的是jsonp)。

请参阅How can I post data as form data instead of a request payload?

也许“并且传递的数据应该转换为字符串”是相关的。

答案 2 :(得分:0)

jQuery data中的

$.ajax与Angular data中的$http.get/post不对应。您可能必须在Angular中使用params而不是data。你看过这个:

jQuery ajax request works, same AngularJS ajax request doesn't

答案 3 :(得分:0)

由于内容类型,删除标题部分或添加

,问题正在发生
    contentType:false or 'multipart/form-data'

      $http({
        method:'POST',
        url:'url'
        data:formData,
        contentType:false,
        processData: false
    }).
    then(function(result) {
        alert(result);
    });