将文件附加到FormData不能在angularjs中工作

我使用angularjs在单个请求中上传文件和json对象到nodejs服务器。 然后我得到这个萤火虫console.log:

-----------------------------8791641017658 Content-Disposition: form-data; name="model" {"phone":"asasasa","description":"121212112","payment":"2121212121","shipping":"121221221","imageurl":"21212112","price":"212112212","status":"new"} -----------------------------8791641017658-- 

所以,name =“file”不会出现在这里。

和nodejs服务器中的console.log(req.files) // print out "{}"

请帮忙,谢谢!

 $scope.files = []; $scope.$on("fileSelected", function (event, args) { $scope.$apply(function () { //add the file object to the scope's files collection $scope.files.push(args.file); console.log($scope.files); }); }); $scope.create = function() { $scope.seller_submit = { phone: this.phone, description: this.description, payment: this.payment, shipping: this.shipping, imageurl: this.imageurl, price: this.price, status: this.status }; $http({ method: 'POST', url: '/articles/'+ $routeParams.articleId, headers: { 'Content-Type': undefined }, transformRequest: function (data) { var formData = new FormData(); formData.append("model", angular.toJson(data.model)); for (var i = 0; i < data.files; i++) { formData.append("file" + i, data.files[i]); } return formData; }, data: { model: $scope.seller_submit, files: $scope.files } }). success(function (data, status, headers, config) { alert("success!"); }). error(function (data, status, headers, config) { alert("failed!"); }); 

       

网上收集的解决方案 "将文件附加到FormData不能在angularjs中工作"

你可以为此创build一个服务

 myApp.service('uploadsService', function($http) { var code = ''; var fileName = ''; this.uploadFile = function(files) { var fd = new FormData(); //Take the first selected file fd.append("image", files[0]); var promise = $http.post('/uploads/uploadFile.json', fd, { withCredentials: true, headers: {'Content-Type': undefined }, transformRequest: angular.identity }).then(function(response) { code = response.data.code; fileName = response.data.fileName; return{ code: function() { return code; }, fileName: function() { return fileName; } }; }); return promise; }; }); 

所以你可以在你的控制器中做一些事情:

  $scope.uploadFile = function(files) { uploadsService.uploadFile(files).then(function(promise){ $scope.code = promise.code(); $scope.fileName = promise.fileName(); }); }; 

在你看来:

 <input type="file" onchange="angular.element(this).scope().uploadFile(this.files)" ng-model="image"> 

适用于我:)