angularjs导出excel

最新推荐文章于 2022-07-25 13:08:43 发布

fn_2015

最新推荐文章于 2022-07-25 13:08:43 发布

阅读量6.5k

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/fn_2015/article/details/54943868

在AngularJS中导出Excel文件时，需注意在HTTP请求中设置'responseType': 'arraybuffer'以避免乱码问题。使用'{type: "application/vnd.ms-excel"}'能创建xls格式，适合旧版Excel，而'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'则生成xlsx格式。为了避免浏览器拦截，推荐通过动态创建并触发click事件来下载，而非使用window.open()。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

$scope.exportExcel = function(){
if($scope.queryCallControl.starttime==""){
$scope.queryCallControl.starttime=null;
}
if($scope.queryCallControl.endtime==""){
$scope.queryCallControl.endtime=null;
}
return $http({
url: 'CallControlLogcontroller/getExport.do',
method: "POST",
headers: {
'Content-type': 'application/json'
},
data:$scope.queryCallControl,
responseType: 'arraybuffer'
}).success(function (data) {
// var blob = new Blob([data], {type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"});
//使用{type: "application/vnd.ms-excel"}的写法，可以保存为xls格式的excel文件（兼容老版本）。而使用“application/vnd.openxmlformats-officedocument.spreadsheetml.sheet”则会保存为xlsx
var blob = new Blob([data], {type: "application/vnd.ms-excel"});
var time=$scope.CurentTime();
var filename="temp_" + time + ".xls";
if (window.navigator.msSaveOrOpenBlob) {// For IE:
navigator.msSaveBlob(blob, filename);
}else{ // For other browsers:
var objectUrl = URL.createObjectURL(blob);
var a = document.createElement('a');
document.body.appendChild(a);
// var filename = data.headers('Content-Disposition').split(';')[1].trim().substr('filename='.length);
console.log("filename:"+filename);
a.setAttribute('style', 'display:none');
a.setAttribute('href', objectUrl);
a.setAttribute('download', filename);
a.click();
URL.revokeObjectURL(objectUrl);

}

});

1.post的方法里要加responseType: 'arraybuffer'参数，不然下载的excel会乱码（这点一开始没注意到，费力好久）

2.使用{type: "application/vnd.ms-excel"}的写法，可以保存为xls格式的excel文件（兼容老版本）。而使用“application/vnd.openxmlformats-officedocument.spreadsheetml.sheet”则会保存为xlsx

3.使用增加节点调用click方法，而不使用帖子中的window.open(objectUrl)方法，是防止被浏览器当插件屏蔽弹出连接

参考：

http://stackoverflow.com/questions/22447952/angularjs-http-post-convert-binary-to-excel-file-and-download

法二：

   $http.post($rootScope.restful_api.last_output_excel,body_data,{responseType: 'arraybuffer'}).success(function(data){
                var blob = new Blob([data], {type: "application/vnd.ms-excel"});
                var objectUrl = URL.createObjectURL(blob);
                var aForExcel = $("<a><span class='forExcel'>下载excel</span></a>").attr("href",objectUrl);
                $("body").append(aForExcel);
                $(".forExcel").click();
                aForExcel.remove();
            })