Angular JS 无法将表单数据与文件数据一起发送

Posted 2023-05-09

【中文标题】Angular JS 无法将表单数据与文件数据一起发送

【英文标题】：Angular JS couldn't send form data with file-data together

【发布时间】：2016-08-12 23:39:20

【问题描述】：

angularjs 新手。我有一个表单，其中一个输入字段具有文件类型。剩下的都是文本和选择字段。我希望，当我提交表单时，包括文件数据在内的所有表单数据都应该一起发布。这是我的代码，请查看。

//html

<input type="file" name="student_image" onchange="angular.element(this).scope().uploadFile(this.files)" ng-model="formData.studentImage" id="student_image">

//JS

var from_data = new FormData();
$scope.uploadFile = function (files) 
        from_data.append("file", files[0]);
;
$scope.submit = function () 
        from_data.append('fullname',$scope.formData.studentFullname);
        from_data.append('fullname',$scope.formData.studentEmail);
        from_data.append('class',$scope.formData.studentClass);
        $http(
            method: 'POST',
            url: 'process.php',
            enctype: 'multipart/form-data',
            processData: false,
            data: from_data, // pass in data as strings
            headers: 'Content-Type': false  // set the headers so angular passing info as form data (not request payload)
        ).success(function (data) 
            console.log(data);
        );
    ;

【参考方案1】：

没有enctype 和processData 属性。您还需要防止 JSON 序列化。以下应该有效：

$http(
        method: 'POST',
        url: 'process.php',
        data: from_data, 
        headers: 'Content-Type': undefined,
        transformRequest: angular.identity, //to prevent JSON serialization