angularjs中$http異步上傳Excel文件方法
1.文件上傳框html代碼如下
<form id="fileForm" enctype="multipart/form-data"> <button id="import_asset" type="button" ng-click="import_asset()">上傳文件</button> <input id="file_asset" type="file" style="display: none;"/> </form>
*注意: 設(shè)置form的enctype屬性值為:multipart/form-data
2:js代碼如下:
$scope.import_asset = function () { $("#file_asset").click(); }; $("#file_asset").on("change", function(){ var formData = new FormData(); var file = document.getElementById("file_asset").files[0]; if(file.name){ var fileName = file.name.substring(file.name.lastIndexOf(".") + 1); if(fileName =="xlsx" || fileName =="xls"){ formData.append('file', file); $http({ method:"post", url:commonService.projectName + "/so/assetmanage/upload", data:formData, headers : { 'Content-Type' : undefined }, transformRequest : angular.identity }).then(function (response) { if(response.status == 200){ alert("文件上傳成功?。。?); }else{ alert("文件上傳失?。。。?); } }); }else{ alert("文件格式不正確,請(qǐng)上傳以.xlsx,.xls 為后綴名的文件。"); $("#file_asset").val(""); } } });
相關(guān)文章
Angular4綁定html內(nèi)容出現(xiàn)警告的處理方法
這篇文章主要給大家介紹了關(guān)于Angular4綁定html內(nèi)容出現(xiàn)警告的處理方法,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧。2017-11-11AngularJS實(shí)現(xiàn)自定義指令與控制器數(shù)據(jù)交互的方法示例
這篇文章主要介紹了AngularJS實(shí)現(xiàn)自定義指令與控制器數(shù)據(jù)交互的方法,結(jié)合具體實(shí)例形式分析了AngularJS自定義指令的實(shí)現(xiàn)以及與控制器數(shù)據(jù)交互的操作技巧,需要的朋友可以參考下2017-06-06Angular實(shí)現(xiàn)一個(gè)簡(jiǎn)單的多選復(fù)選框的彈出框指令實(shí)例
下面小編就為大家?guī)硪黄狝ngular實(shí)現(xiàn)一個(gè)簡(jiǎn)單的多選復(fù)選框的彈出框指令實(shí)例。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-04-04Angular之toDoList的實(shí)現(xiàn)代碼示例
本篇文章主要介紹了Angular之toDoList的實(shí)現(xiàn)代碼示例,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-12-12Angular中使用ng-zorro圖標(biāo)庫部分圖標(biāo)不能正常顯示問題
這篇文章主要介紹了Angular中使用ng-zorro圖標(biāo)庫部分圖標(biāo)不能正常顯示問題,非常不錯(cuò),具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2019-04-04Angular項(xiàng)目從新建、打包到nginx部署全過程記錄
一直比較喜歡angular,正巧最近有個(gè)項(xiàng)目用到了,所以想和大家來分享下,下面這篇文章主要給大家介紹了關(guān)于Angular項(xiàng)目從新建、打包到nginx部署的相關(guān)資料,文中通過示例代碼介紹的非常詳細(xì),需要的朋友可以參考下。2017-12-12AngularJs bootstrap搭載前臺(tái)框架——基礎(chǔ)頁面
本文主要介紹AngularJs bootstrap搭載前臺(tái)框架基礎(chǔ)頁面的建設(shè),這里整理餓了相關(guān)資料及實(shí)現(xiàn)實(shí)例代碼,有興趣的小伙伴可以參考下2016-09-09