离子2中的Pdf生成

时间:2017-03-26 19:26:50

标签: ionic2

我目前正在一个小项目中工作。我想在我的Android手机中使用ionic2+angular2(typescript)生成一个pdf。我正在使用pdfMake。

这是我的代码:

getPdf() {


var docDefinition = { content: 'This is an sample PDF printed with pdfMake' };

     pdfMake.createPdf(docDefinition).getBuffer((buffer) => {
     var utf8 = new Uint8Array(buffer); // Convert to UTF-8...
     let binaryArray = utf8.buffer; // Convert to Binary...

     let fileName = "file.pdf";
     let saveDir = cordova.file.externalApplicationStorageDirectory;

       File.createFile(saveDir, fileName, true).then((fileEntry) => {
         fileEntry.createWriter((fileWriter) => {
             fileWriter.onwriteend = () => {
               let toast = this.toastCtrl.create({
                 message: 'PDF gerado com sucesso! Abrindo arquivo...',
                 duration: 2000,
                 position: 'middle'
               });
               toast.onDidDismiss(() => {
                 cordova.plugins.fileOpener2.open(
                   saveDir+fileName,
                   'application/pdf');
               });
               //this.navCtrl.present(toast);
               toast.present();
             };
             fileWriter.onerror = (e) => {
                 console.log('file writer - error event fired: ' + e.toString());
             };
             fileWriter.write(binaryArray);
         });
       });
     });
  }

由于createWriter类型不存在属性createWriter,因此FileEntry|FileError显示错误。

1 个答案:

答案 0 :(得分:0)

导入语句可能有问题

import * as pdfmake from 'pdfmake/build/pdfmake';
import 'pdfmake/build/vfs_fonts';

将其添加到index.html文件

 <body>

  <!-- Ionic's root component and where the app will load -->
  <ion-app></ion-app>

  <!-- The polyfills js is generated during the build process -->
  <script src="build/polyfills.js"></script>

  <!-- The bundle js is generated during the build process -->
  <script src="build/main.js"></script>
  <script src='pdfmake/build/pdfmake.min.js'></script>
  <script src='pdfmake/build/vfs_fonts.js'></script>


</body>