使用 blob 将 html 表导出为 pdf

Question

我想知道如何从 angularjs 导出 pdf 文件。我已经导出了 excel 文件，它工作正常。

以下是excel的代码

view.html

<button ng-click="vm.exportData()" class="btn btn-info"><i class="glyphicon glyphicon-download"></i>&nbsp; Download as pdf</button>

controller.js

 $scope.exportData = function () {
        debugger;
        var blob = new Blob([document.getElementById('export').innerHTML], {
            type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8"
        });
        window.saveAs(blob, "Report.xls");
    },

怎么做 type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8"

提前致谢:)

Answer 1

更新：

您可以通过设置 responseType 将 pdf 内容检索为 ArrayBuffer：

  $http({
                url: url,
                method: method,
                headers: {
                    'Content-type': _type
                },
                responseType: 'arraybuffer' //set response type
            })

注意：

类型 -> '应用程序/pdf'

fileContent -> 应该是一个 ArrayBuffer

downloadFile(filename, 'application/pdf', fileContent);

function downloadFile(filename, type, fileContent) {
    var blob = new Blob([fileContent], {type: type});
    if (navigator.msSaveBlob) { // IE 10+
        navigator.msSaveBlob(blob, filename);
    } else {
        var link = document.createElement('a');
        if (link.download !== undefined) { // feature detection
            // Browsers that support HTML5 download attribute
            var url = URL.createObjectURL(blob);
            link.setAttribute('href', url);
            link.setAttribute('download', filename);
            link.style.visibility = 'hidden';
            document.body.appendChild(link);
            link.click();
            document.body.removeChild(link);
        }
    }
}