Question

我正在使用html2canvas将html转换为图像，然后导出为pdf文件。这是我使用此软件包的步骤：

添加html2canvas
添加代码以将html转换为图像。
```
Xamarin.Forms
```

其中comp是角度分量，doc是jsPDF，save是布尔值。调用html2canvas时将引发以下错误。

<ContentPage.ToolbarItems>
    <ToolbarItem Text="X" Priority="-1" Command="{Binding GoCancel}"/>
    <ToolbarItem Icon="icon_save" Command="{Binding GoSave}"/>
</ContentPage.ToolbarItems>

html2canvas是一个非常有用的程序包，但是此错误确实很严重。请帮忙。

Answer 1

我也遇到了同样的问题，并得出结论，这是一个错误。快速搜索后，我遇到了这个线程：

https://github.com/niklasvh/html2canvas/issues/1593

...用户（adamszeibert）指出负责的代码段：

我发现在我的情况下，该错误来自https://github.com/niklasvh/html2canvas/blob/master/src/Clone.js中第572行附近的iframeLoader。

我可以通过更改代码以返回Promise.resolve（cloneIframeContainer）来解决该问题。   我很确定此修复程序可以打破许多其他用例，但是对于我所需要的它可以解决此问题。

解决方案1：

截止到今天，该解决方案有一个公开拉取请求：

https://github.com/niklasvh/html2canvas/pull/1681

解决方案2：

使用NgZone的runOutsideAngular方法。

步骤1： 从Angular Core导入NgZone：

import {NgZone} from '@angular/core';

步骤2： 将ngZone添加到组件构造函数中：

  constructor(
              ...
              ...
              private _ngZone: NgZone) {
                  ...
              }

第3步： 封装您的html2canvas代码，如下所示：

  public saveAsImage = () => {

    this._ngZone.runOutsideAngular(() => {

        html2canvas(document.getElementsByTagName('canvas')[0]).then(canvas => {
            let a = document.createElement('a');
            a.href = canvas.toDataURL("image/jpeg").replace("image/jpeg", "image/octet-stream");
            a.download = 'Some Filename.jpg';
            a.click();
          });
    });
  };

Answer 2

我遇到了同样的问题，并对此进行了修复：

html2canvas(element, {
    ignoreElements: (node) => {
        return node.nodeName === 'IFRAME';
    }
}).then((canvas) => {
    ...
});

来源：https://github.com/niklasvh/html2canvas/issues/1593#issuecomment-489059452

html2canvas：未捕获的错误（按承诺）：[object undefined] angular 6

2 个答案:

解决方案1：

解决方案2：