<button class="btn w-xs btn-success" ng-disabled="problemList.length == 0" ng-click="exportData()">導出</button> <table class="table table-striped table-hover" id="tableExcel"> <thead> <tr> <th>名稱</th> <th>河段名稱</th> <th>建立人</th> <th>問題類型</th> <th>來源</th> <th>問題狀態</th> <th>建立時間</th> <th>操做</th> </tr> </thead> <tbody> <tr ng-repeat="list in problemList"> <td ng-click="detailsShow(list.id,$event)"> <a>{{ ::list.name }}</a> </td> <td>{{ ::list.reachName }}</td> <td>{{ ::list.creatorName }}</td> <td> <span ng-repeat="(k,v) in list.type">{{ ::v }} </span> </td> <td>{{ ::list.sourceStr }}</td> <td> <label class="label" ng-class="list.status == 2?'label-warning':'label-success'">{{ ::list.statusStr }}</label> </td> <td>{{ (list.createDate) | date: "yyyy-MM-dd HH:mm" }}</td> <td></td> </tr> </tbody> </table>
/** * 導出問題列表爲excel */ $scope.exportData=function(){ var data = angular.copy($scope.problemList) var arr = []; angular.forEach(data,function (item) { //問題類型 // if(!jQuery.isEmptyObject(item.type)) { // } arr.push({ '名稱': item.name, '河道': item.riverName, '河段名稱': item.reachName, '行政區域': '', '建立人': item.creatorName, '問題類型': '', '來源': item.sourceStr, '問題狀態': item.statusStr, '建立時間': $filter('date')(item.createDate,'yyyy-MM-dd HH:mm') }) }) if(arr.length < 1){ toastr.error('暫無數據,導出失敗!'); }else{ alasql.promise('SELECT * INTO XLSX("河道問題列表'+'.xlsx", {headers:true}) FROM ?',[arr]) .then(function (data) { if(data == 1){ $timeout(function(){ toastr.success('數據導出成功!') }) } }) } }
js部分須要引入兩個js文件https://blog-static.cnblogs.com/files/bertha-zm/xlsx.core.min.js 和 https://blog-static.cnblogs.com/files/bertha-zm/alasql.min.jsjavascript
js部分代碼:html