如何使用 Angular 和 FormData 简化发送（文件、模型）答案

【问题标题】：How to simplify sending (file, model) with angular and FormData如何使用 Angular 和 FormData 简化发送（文件、模型）
【发布时间】：2016-04-24 15:26:59
【问题描述】：

我有一个包含一堆文本字段和一个文件字段的表单。我正在使用 multer 接收文件，并且效果很好。我已设法在请求中包含所有必要的数据，但我对我的解决方案不满意。有没有更好的方法来附加表单的参数而不是手动指定每个字段？

$scope.createJob = function() {
  var fd = new FormData();
  fd.append("logo", $scope.logo);
  fd.append("title", $scope.formData.title);
  fd.append("title", $scope.formData.description);
  fd.append("title", $scope.formData.hiringOrganization);
  fd.append("title", $scope.formData.jobLocation);
  fd.append("title", $scope.formData.url);
  $http.post('/api/v1/jobs', fd, {
    transformRequest: angular.identity,
    headers: {'Content-Type': undefined}
  })
  .success(function(data) {
    console.log(data);
  })
  .error(function(data) {
    console.log('Error: ' + data);
  });
};

如您所见，我附加了 formData 对象的每个参数。我试过了

fd.append("body", $scope.formData);

但我最终得到了字符串“[Object object]”。

【问题讨论】：

标签： javascript angularjs node.js multipartform-data

【解决方案1】：

你可以遍历 formData 对象来缩短你的代码：

var fd = new FormData();

for (var property in $scope.formData) {
    if ($scope.formData.hasOwnProperty(property)) {
        fd.append(property, $scope.formData[property]);
    }
}

【讨论】：

【解决方案2】：

不！这不是最好的方法。您应该使用 javascript 对象，然后，您必须使用 angular.toJson() 方法将对象转换为 .json 文件。之后就可以发布json了。

有关更多信息，请查看此示例：http://jsfiddle.net/aq6SY/ 并查看文档：https://docs.angularjs.org/api/ng/function/angular.toJson

【讨论】：

我不太明白你的意思，你能用我的代码作为例子吗？