angularjs ajax无刷新下载

最新推荐文章于 2022-04-07 15:53:11 发布

原创最新推荐文章于 2022-04-07 15:53:11 发布 · 513 阅读

0 ·

CC 4.0 BY-SA版权

本文介绍了一个用于从AngularJS应用中下载Excel文件的自定义指令。该指令通过HTTP GET请求获取数据，并将其转换为Excel文件供用户下载。文章详细展示了如何使用Blob对象和HTML5的a标签实现这一功能。

lb-statistics-filter-directive.html

 <a class="btn btn-sm btn-primary" ng-click="downloadExcel(downloadUrl)" target="_blank" ng-class="{'disabledEvent':!hasPreviewData}">

lb-statistics-filter-directive.js

  controller: function($scope,$http, $element, $attrs){
            $scope.downloadExcel = function(downloadUrl){
                console.log(downloadUrl)
                $http.get(downloadUrl,
                    {responseType: "arraybuffer"},
                    {timeout:600000}
                )
                .success(function (data, status, headers, config) {
                    var blob = new Blob([data], {type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"});
                    var a = document.createElement("a");
                    document.body.appendChild(a)
                    a.download =  $filter('date')(new Date(), 'yyyyMMddHHmmss') + ".xls";
                    a.href = URL.createObjectURL(blob);
                    a.click();
                })
            }