在 AngularJS 单页面应用（SPA）中，文件上传是一个常见的需求。本文将介绍 AngularJS SPA 应用中实现文件上传的几种方式，并提供示例代码。
1. 使用 <input type="file"> 元素
最简单的方式是使用 HTML5 中的 <input type="file"> 元素，它可以让用户选择需要上传的文件。在 AngularJS 中，我们可以使用 ng-model 指令来绑定该元素的值，并通过 FormData 对象将文件上传到服务器。
HTML 代码：
<input type="file" ng-model="file"> <button ng-click="upload()">上传</button>
JavaScript 代码：
-- -------------------- ---- -------
------------- - ---------- -
--- -------- - --- -----------
----------------------- -------------
--------------------- --------- -
----------------- -----------------
-------- ---------------- ----------
-------------------------- -
---------------------------
---
--上述代码中，我们使用 $http 服务发送 POST 请求，并将 FormData 对象作为请求体。我们还需要设置请求头 Content-Type 为 undefined，以告诉 AngularJS 不要设置默认的 Content-Type，而是让浏览器自动设置。
2. 使用第三方库
除了上述方式外，我们还可以使用第三方库来实现文件上传。这些库通常提供更丰富的功能，例如文件类型限制、进度条显示等。
以下是几个常用的文件上传库：
这些库都提供了详细的文档和示例代码，使用起来非常方便。
3. 总结
本文介绍了在 AngularJS SPA 应用中实现文件上传的几种方式。使用 <input type="file"> 元素是最简单的方式，而使用第三方库则可以提供更丰富的功能。选择哪种方式取决于具体的需求和项目实际情况。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/65163f5695b1f8cacde94287