angularjs - 使用 AngularJS 上传文件

Question

这是我的 HTML 表单:

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

我想从本地计算机上传图像并希望读取上传文件的内容。所有这些我都想使用 AngularJS 来完成。

当我尝试打印 $scope.file 的值时，它显示为未定义。

Answer 1

这里的一些答案建议使用 FormData() ，但不幸的是，这是一个浏览器对象，在 Internet Explorer 9 及更低版本中不可用。如果您需要支持那些较旧的浏览器，您将需要一个备份策略，例如使用 <iframe>或闪存。

已经有很多 Angular.js 模块来执行文件上传。这两个对旧版浏览器有明确的支持:

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

以及其他一些选项:

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

其中一个应该适合您的项目，或者可以让您深入了解如何自己编码。