Angular 提交form表單實現(xiàn)文件上傳

<!DOCTYPE html>
<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>
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
【社區(qū)內容提示】社區(qū)部分內容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發(fā)布,文章內容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內容

友情鏈接更多精彩內容