angularjs实现导出excel

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

Steatch

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

阅读量849

点赞数

HTML部分：

<body ng-app="InfringementNoticeApp" ng-controller="InfringementNoticeController">

<button class="btn btn-link" ng-click="exportToExcel('#table1')">
<span class="glyphicon glyphicon-share">导出Excel</span>
</button>

</body>

JS部分：

(function () {
var app = angular.module('InfringementNoticeApp', ['ng-pagination']);

自定义导出factory：

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></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;
}
};
});

app.controller('InfringementNoticeController', function ($scope, $http,Excel,$timeout) {

......

//在table对应的controller里面添加方法：（调用之前要引用factory，$timeout）
//导出excel
$scope.exportToExcel = function(tableId) {
$scope.exportHref = Excel.tableToExcel(tableId, 'sheet name');
$timeout(function() { location.href = $scope.exportHref; }, 100); // trigger download
}

var infringementNotices = [
{
IsPay: '扣款',
Operate: '通知'
}
];

......

}）

})();