发布于 4年前

Angular 提交form表单实现文件上传


<html ng-app="myApp" ng-controller='myCtrl'>

<head>
    <title></title>
    <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
    <script src="https://cdn.bootcss.com/angular.js/1.2.0/angular.js"></script>
</head>

<body>
    <form id="tf">
        <input type="file" name="file" />
        <input type="text" name="username" />
        <input type="button" value="提" ng-click="test();" />
    </form>
    <script type="text/javascript">
    angular.module('myApp', [])
        .controller('myCtrl', ['$scope', '$http', function($scope, $http) {
            $scope.test = function test() {
                var form = new FormData(document.getElementById("tf"));
                $http({
                    url: "http://192.168.10.133:8080/ktl/resource/getSourceData",
                    method: "post",
                    data: form,
                    transformRequest: angular.identity,
                    headers : {
                        'Content-Type' : undefined  //angularjs设置文件上传的content-type修改方式
                    }
                }).success(function(_d){
                    console.log(_d);
                }).error(function(err){
                    console.log(err);
                });
            }
        }])
    </script>
</body>

</html>
©2020 edoou.com   京ICP备16001874号-3