使用AngularJS文件上传 [英] File Upload using AngularJS

问题描述

下面是我的HTML表单：

Here is my HTML form:

<form name="myForm" ng-submit="">
    <input ng-model='file' type="file"/>
    <input type="submit" value='Submit'/>
</form>

我要上传从本地计算机的图像，并想读取上传文件的内容。这一切我想用AngularJS的事情。

I want to upload an image from local machine and want to read the content of the uploaded file. All this I want to do using AngularJS.

当我尝试打印 $ scope.file 的值，它作为不确定的。

When I try to print the value of $scope.file it comes as undefined.

推荐答案

这里的某些答案，建议使用 FORMDATA（），但不幸的是不可用的浏览器对象在Internet Explorer 9和表。如果你需要支持这些旧的浏览器，你将需要一个备份策略，如使用＆LT; IFRAME方式＆gt; 或Flash

Some of the answers here propose using FormData(), but unfortunately that is a browser object not available in Internet Explorer 9 and below. If you need to support those older browsers, you will need a backup strategy such as using <iframe> or Flash.

现在已经有很多Angular.js模块来执行文件上传。这两对老版本浏览器的明确支持：

There are already many Angular.js modules to perform file uploading. These two have explicit support for older browsers:

• https://github.com/leon/angular-upload - 使用内部框架作为后备


• https://github.com/danialfarid/ng-file-upload - 使用FileAPI / Flash作为后备

• https://github.com/leon/angular-upload - uses iframes as a fallback
• https://github.com/danialfarid/ng-file-upload - uses FileAPI/Flash as a fallback

和一些其他的选择：

• https://github.com/nervgh/angular-file-upload/


• https://github.com/uor/angular-file


• https://github.com/twilson63/ngUpload


• https://github.com/uploadcare/angular-uploadcare

• https://github.com/nervgh/angular-file-upload/
• https://github.com/uor/angular-file
• https://github.com/twilson63/ngUpload
• https://github.com/uploadcare/angular-uploadcare

其中的一个应该适合你的项目，也可能给你一些深入了解如何给自己code吧。

One of these should fit your project, or may give you some insight into how to code it yourself.

这篇关于使用AngularJS文件上传的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！