angularjs 页面table导出excel

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

对门老刘

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

阅读量676

点赞数

本文链接：https://blog.csdn.net/qq_31983635/article/details/88050914

版权

参考页面: https://www.cnblogs.com/gzhlt/p/5274702.html

百度上面一搜有很多的例子,都是一样照搬的, 发现有两个问题

1. 中文乱码的问题

2. 文件无法自定义名字的问题

3. 导出的其实是html页面用excel打开, 会提示文件可能一损坏,是否确认打开的提示,修改文件保存的时候还必须另存为

上面的两个问题,这里进行总结

中文乱码的问题是在 excel模板中加入 <meta charset="UTF-8">即可


    app.factory('Excel',function($window){
        var uri='data:application/vnd.ms-excel;base64,',
            template='<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns="http://www.w3.org/TR/REC-html40"><head><meta charset="UTF-8"><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>{worksheet}</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]--></head><body><table>{table}</table></body></html>',
            base64=function(s){return $window.btoa(unescape(encodeURIComponent(s)));},
            format=function(s,c){return s.replace(/{(\w+)}/g,function(m,p){return c[p];})};
        return {
            tableToExcel:function(tableId,worksheetName){
                var table=$(tableId),
                    ctx={worksheet:worksheetName,table:table.html()},
                    href=uri+base64(format(template,ctx));
                return href;
            }
        };
    })

js中添加方法:

//导出excel
        $scope.exportToExcel=function(tableId){ // ex: '#my-table'
            //获取统计变量分组
            if(!$scope.downCols.length>0) {
                layer.alert('请选择 [ 统计变量 ] ');
                return;
            }
            var fileName="导出的文件名称";
            $scope.exportHref=Excel.tableToExcel(tableId,'sheet1');
            //$timeout(function(){location.href=$scope.exportHref;},100); // trigger download
            $timeout(function(){document.getElementById("dlink").href = $scope.exportHref},200); // trigger download
            document.getElementById("dlink").download =fileName;//这里是关键所在,当点击之后,设置a标签的属性,这样就可以更改标签的标题了
            $timeout(function(){document.getElementById("dlink").click()},2000); // trigger download
        }

页面中添加一个A标签用来设置文件名

<a id="dlink"  style="display:none;"></a><!--excel-->

第三个问题暂时还没有解决办法, 有没有大神给知道一下哈!!!

对门老刘

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
angularjs 页面table导出excel

参考页面:https://www.cnblogs.com/gzhlt/p/5274702.html百度上面一搜有很多的例子,都是一样照搬的, 发现有两个问题1. 中文乱码的问题2. 文件无法自定义名字的问题3. 导出的其实是html页面用excel打开, 会提示文件可能一损坏,是否确认打开的提示,修改文件保存的时候还必须另存为上面的两个问题,这里进行总结中文乱码的...
复制链接

扫一扫