AngularJs实现表单文件的上传（2.0版本以下）

一：传统的表单提交方式

<form action="url" method="post" enctype="multipart/form-data">
    <input type="file" name="file" />
    <input type="text" name="username" />
    <input type="submit" value="提交">
</from>

二: angularjs处理文件上传

<form id="myForm">
    <input type="file" name="file" />
    <input type="text" name="username" />
    <input type="button" value="提交" ng-click="upLoad();" />
</form>

angular.module('myApp', [])
        .controller('myController', function($scope, $http) {
            var form = new FormData(document.getElementById("myForm"));
            $scope.upLoad = function() {
                $http({
                    url: "url",
                    method: "post",
                    data: form,
                    transformRequest: angular.identity,
                    headers: {
                        'Content-Type': undefined
                    }
                }).then(function(response) {
                    // 请求成功执行代码
                    alert("成功")
                }, function(response) {
                    // 请求失败执行代码
                    alert("失败")
                });
            }
        });

！注意

1. 因为是通过anjularjs的http请求来上传文件的，所以要让当前的request成为一个Multipart/form-data请求，anjularjs对于post和get请求默认的Content-Type header 是application/json。
   所以，通过设置headers : {‘Content-Type’ : undefined}这样浏览器不仅帮我们把Content-Type 设置为 multipart/form-data，还填充上当前的boundary，如果你手动设置为： ‘Content-Type’: multipart/form-data，后台会抛出异常：the current request boundary parameter is null。
2. 通过设置 transformRequest: angular.identity ，anjularjs transformRequest function 将序列化我们的formdata object.