我想做一个简单的从AngularJS到node.js服务器的多部分表单post,表单应该在一部分包含一个JSON对象,在另一部分包含一个图像(我目前只使用$resource发布JSON对象)。
我想我应该从输入文件“type=”开始,但后来发现AngularJS不能绑定到那个文件。
我能找到的所有例子都是为拖放包装jQuery插件。我想要一个简单的文件上传。
我是AngularJS的新手,对编写自己的指令感到很不舒服。
发布于 2013-08-25 00:53:50
您可以使用simple/lightweight ng-file-upload指令。它支持非HTML5浏览器的拖放、文件进度和文件上传,支持FileAPI flash填充
<div ng-controller="MyCtrl">
<input type="file" ngf-select="onFileSelect($files)" multiple>
</div>
JS:
//inject angular file upload directive.
angular.module('myApp', ['ngFileUpload']);
var MyCtrl = [ '$scope', 'Upload', function($scope, Upload) {
$scope.onFileSelect = function($files) {
Upload.upload({
url: 'my/upload/url',
file: $files,
}).progress(function(e) {
}).then(function(data, status, headers, config) {
// file is uploaded successfully
console.log(data);
});
}];
发布于 2012-12-20 07:50:44
我刚刚遇到了这个问题。因此,有几种方法。首先,新的浏览器支持
var formData = new FormData();
Follow this link to a blog with info about how支持仅限于现代浏览器,但除此之外,它完全解决了这个问题。
否则,您可以使用target属性将表单发布到iframe。在发布表单时,请确保将目标设置为iframe,并将其display属性设置为none。目标是iframe的名称。(只想让你知道。)
我希望这能帮到你
发布于 2016-02-16 19:30:20
我知道这是一个较晚的条目,但我已经创建了一个简单的upload指令。你很快就可以开始工作了!
<input type="file" multiple ng-simple-upload web-api-url="/api/post"
callback-fn="myCallback" />
关于Github的ng-simple-upload更多信息,并提供了一个使用Web的示例。
https://stackoverflow.com/questions/13963022
复制相似问题