form post multipart/form-data and angular.js $http.post multipart/form-data don't equlas

[김진우]

hello i'm korean so i know a little english

i was execute angular.js post and form post

angular.js execute :

$http

({

method: 'POST',

url: 'myurl', -> java sevlet

data: angular.toJson($scope.title),

file: $scope.files,

headers: {  'Content-Type': "multipart/form-data; boundary=ZYDa6MZ62846kJOUYu9kybvA750KGm3r" }

})

result : MultipartHttpServletRequest data is null and Accept:application/json, text/plain, */*

form excute :

<form action="myurl" method="POST" enctype="multipart/form-data"  ng-controller="PictureBoardWriteCtrl">

result :  MultipartHttpServletRequest data is not null and  Accept:text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8

so i did change $http accept -> Accept:text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8

but $http post MultipartHttpServletRequest data is null

i don't know result

why is it?

[Sander Elias]

Hi 김진우, 

For a multi-part form you need to build one into your data using the new formData api. Also you need to use a little trick.

Here is a small sample:

var fd = new FormData();
fd.append('title', angular.toJson($scope.title));
$http.post(uploadUrl, fd, {
    transformRequest: angular.identity,
    headers: {'Content-Type': undefined}
 }).then(....)

The tranformrequest puts in a `special handler` for multi-part form data. The angualr.identity is a function that returns the parameters unchanged. That sounds more complex as it is, think like this: function(parameter) {return parameter;}. With this, you tell angular not to mess with the content, and leave it as is. Then the content-type is set to undefined. This way, you let the browser take care of this. 

I hope this helps you a bit,

Regards

Sander