Question

我正在尝试使用html2pdf将数据导出为PDF。首先，我写了一个简单的例子，当点击导出按钮时，打开一个新的空白窗口，没有任何内容导出到它，有什么建议吗？

演示：https://plnkr.co/edit/ruWKJBQiZ9QgUjxaBzbo?p=preview

html代码：

 <div ng-controller="listController">
        <button ng-click="export()">export</button>
     <h3> Simple Test</h3>

  </div>

js code：

 app.controller("listController", ["$scope",
   function($scope) {

 $scope.export = function() {

     var pdf = new jsPDF('p', 'pt', 'letter');
        var canvas = pdf.canvas;
        canvas.height = 72 * 11;
        canvas.width= 72 * 8.5;;
        // can also be document.body
        var html = '<html><body>Hello from JS file <strong> World</strong></body></html>';
        html2pdf(html, pdf, function(pdf) {
                pdf.output('dataurlnewwindow');
        });
   }
   }
 ]);

当用户点击导出按钮时，应导出并显示分配给html变量的字符串。

Answer 1

如果您不想打开新窗口，请使用：

pdf.output('datauri');

dataurinewwindow专门请求PDF在新窗口中打开。

完整示例：

var app = angular.module("app", []);

app.controller("listController", ["$scope",
  function($scope) {

    $scope.export = function() {

      var pdf = new jsPDF('p', 'pt', 'letter');
      var canvas = pdf.canvas;
      canvas.height = 72 * 11;
      canvas.width = 72 * 8.5;;
      // can also be document.body
      var html = '<html><body>Hello from JS file <strong> World</strong></body></html>';
      html2pdf(html, pdf, function(pdf) {
        pdf.output('dataurl');
      });
    }
  }
]);

单击按钮时打开空白窗口

1 个答案: