angularjs上传文件到服务器,AngularJS:如何使用multipart表单实现简单的文件上传?...

 2023-09-09 阅读 28 评论 0

摘要:直接发送文件更有效。该Base64编码的Content-Type: multipart/form-data增加了额外的33%的开销。如果服务器支持它,则直接发送文件更有效:$scope.upload=function(url,file){varconfig={headers:{'Content-Type':undefined},transformRe

直接发送文件更有效。

该Base64编码的Content-Type: multipart/form-data增加了额外的33%的开销。如果服务器支持它,则直接发送文件更有效:$scope.upload = function(url, file) {

var config = { headers: { 'Content-Type': undefined },

transformResponse: angular.identity                 };

return $http.post(url, file, config);};

javascript表单。使用File对象发送POST时,设置很重要'Content-Type': undefined。然后,XHR send方法将检测File对象并自动设置内容类型。我想我应该从input type =“file”开始,但后来发现AngularJS无法绑定到那个..

默认情况下,该元素不适用于ng-model指令。它需要一个自定义指令:

使用“select-ng-files”指令的工作演示ng-model

angular.module("app",[]);

angular.module("app").directive("selectNgFiles", function() {

return {

angularJS。require: "ngModel",

link: function postLink(scope,elem,attrs,ngModel) {

elem.on("change", function(e) {

var files = elem[0].files;

ngModel.$setViewValue(files);

})

搭建文件共享服务器,}

}

});

AngularJS Input `type=file` Demo

Files

{{file.name}}

$http.post 内容类型 multipart/form-data

如果必须发送multipart/form-data:

文件上传服务器,save

$scope.upload = function() {

var fd = new FormData();

fd.append("data", angular.toJson($scope.fdata));

for (i=0; i

fd.append("file"+i, $scope.filesArray[i]);

};

angularjs教程,var config = { headers: {'Content-Type': undefined},

transformRequest: angular.identity                 }

return $http.post(url, fd, config);};

使用FormData API发送POST时,设置很重要'Content-Type': undefined。然后,XHR发送方法将检测FormData对象并自动将内容类型标头设置为具有适当边界的multipart / form-data。

版权声明:本站所有资料均为网友推荐收集整理而来,仅供学习和研究交流使用。

原文链接:https://hbdhgg.com/2/28931.html

发表评论:

本站为非赢利网站,部分文章来源或改编自互联网及其他公众平台,主要目的在于分享信息,版权归原作者所有,内容仅供读者参考,如有侵权请联系我们删除!

Copyright © 2022 匯編語言學習筆記 Inc. 保留所有权利。

底部版权信息