第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全，請及時綁定郵箱和手機立即綁定
已解決430363個問題，去搜搜看，總會有你想問的

使用Angularjs中的pdfMake從HTML生成PDF

使用Angularjs中的pdfMake從HTML生成PDF

紅顏莎娜 2019-08-31 15:03:55
我想創(chuàng)建一個PDF使用我的HTML pdfMake和Angular（我也試了jsPDF，不能讓它無論是工作）。我嘗試在Angular控制器中使用以下代碼：var blob = new Blob([document.getElementById('exportable').innerHTML])var docDefinition = {    content: [blob]}pdfMake.createPdf(docDefinition).open();但是我收到以下錯誤：無法識別的文檔結(jié)構(gòu)：{“_ margin”：null}“。我的HTML由div中的兩個簡單表組成exportable。如果有人知道這個問題的解決方案，或者從Angular獲取HTML到PDF的其他方法，請幫助。任何幫助都非常感謝！
查看完整描述

3 回答

?
溫溫醬

TA貢獻1752條經(jīng)驗 獲得超4個贊

好的，我想出來了。1.你需要html2canvas和pdfmake。您不需要在app.js中進行任何注入，只需包含在腳本標記中


在要創(chuàng)建PDF的div上，添加如下ID ID：


 <div id="exportthis">

在Angular控制器中，在調(diào)用html2canvas時使用div的id：


使用toDataURL（）將畫布更改為圖像


然后在pdfmake的docDefinition中將圖像分配給內(nèi)容。


控制器中完成的代碼如下所示：


       html2canvas(document.getElementById('exportthis'), {

            onrendered: function (canvas) {

                var data = canvas.toDataURL();

                var docDefinition = {

                    content: [{

                        image: data,

                        width: 500,

                    }]

                };

                pdfMake.createPdf(docDefinition).download("Score_Details.pdf");

            }

        });

我希望這有助于其他人?？鞓返木幋a！


查看完整回答
反對 回復 2019-08-31
?
繁星coding

TA貢獻1797條經(jīng)驗 獲得超4個贊

這是它對我有用的我正在使用Angular2應用程序中的html2pdf，所以我在控制器中引用了這個函數(shù)


var html2pdf = (function(html2canvas, jsPDF) {

在html2pdf.js中聲明。


所以我在我的angular-controller聲明中添加了這個聲明：


declare function html2pdf(html2canvas, jsPDF): any;

那么，從我的角度控制器的方法我調(diào)用這個函數(shù)：


generate_pdf(){

    this.someService.loadContent().subscribe(

      pdfContent => {

        html2pdf(pdfContent, {

          margin:       1,

          filename:     'myfile.pdf',

          image:        { type: 'jpeg', quality: 0.98 },

          html2canvas:  { dpi: 192, letterRendering: true },

          jsPDF:        { unit: 'in', format: 'A4', orientation: 'portrait' }

        });

      }

    );

  }

希望能幫助到你


查看完整回答
反對 回復 2019-08-31
  • 3 回答
  • 0 關(guān)注
  • 1550 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯(lián)系客服咨詢優(yōu)惠詳情

 幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學習伙伴

 公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號