Angular 中的 html2canvas - 无法调用类型缺少调用签名的表达式

Posted 2023-03-13

【中文标题】Angular 中的 html2canvas - 无法调用类型缺少调用签名的表达式

【英文标题】：html2canvas in Angular - Cannot invoke an expression whose type lacks a call signature

【发布时间】：2019-11-15 01:01:48

【问题描述】：

我正在尝试将 html2canvas 库用于 Angular 8 项目。

我还尝试通过npm install --save @types/html2canvas 在我的项目中安装 html2canvas 类型，但仍然无法正常工作。

模板：

<div #myform>
  <form>
    ...
  </form>
</div>

组件：

import  Component, OnInit, ViewChild, ElementRef  from '@angular/core';
import * as html2canvas from 'html2canvas';

@Component(
  selector: 'app-pdf-viewer',
  templateUrl: './pdf-viewer.component.html',
  styleUrls: ['./pdf-viewer.component.scss']
)
export class PdfViewerComponent 
  @ViewChild('myform',  static: false, read: ElementRef ) pdfForm: ElementRef;

  constructor() 


  pdfDownload() 
    html2canvas(this.pdfForm.nativeElement).then(canvas => 
      const imgData = canvas.toDataURL('image/png');
      document.body.appendChild(canvas);
    );
  

我的意图是将表单呈现为画布，但应用程序抛出错误：

src/app/grid/pdf-viewer/pdf-viewer.component.ts (19,5) 中的错误：错误 TS2349：无法调用类型缺少调用签名的表达式。键入'typeof import ("myroute")' 你不支持调用签名。

【参考方案1】：

解决了！谢谢你:)

最后我是这样导入的：

import html2canvas from 'html2canvas';

【讨论】：

工作就像魅力，非常感谢兄弟！

【参考方案2】：

对于 Angular 8，请参阅此链接：https://github.com/niklasvh/html2canvas/issues/1896#issuecomment-506129710

基本上，您需要安装 1.0.0-rc.1 版的 html2canvas 才能正常工作。

【参考方案3】：

在 Angular 8 上遇到了同样的问题，我能够正确导入库的唯一方法是使用 require。

See this post.

【讨论】：

正如我所说，对我来说现在它正在使用“import html2canvas from 'html2canvas';”

是的，我知道@Jgascona，只是为其他可能遇到相同问题的人提供另一种选择，因为您的解决方案不适合我。

感谢@velval，希望一些答案对某人有用

这是我设法解决它的唯一方法。我在 Angular 8.2.14 和 html2canvas 1.0.0-rc.5

上运行