Question

我正在尝试使用库推荐的html2canvas，具体如下：

 public takeScreenshot() {
    console.log ('Take screen shot');
    // var options = { allowTaint: true, useCORS : true };
    html2canvas(this.screenCanvas).then(function(canvas)  {  
      const contentData = canvas.toDataURL('image/png');
      console.log('successfully took the byte array for screen shot');
    });  
  }

上面的代码中的this.screenCanvas引用了一个声明为@ViewChild('divCanvas') screenCanvas: ElementRef;的HTML元素

我的html模板如下，

  <div class='cp-screen-actionbar-button' (click)='takeScreenshot()'>
    <span aria-hidden='true'>
      <i class='far fa-eye' title='{{ screenDesignerConfig.LABELS.PREVIEW }}'></i>
    </span>
  </div>

但是，当调用函数takeScreenshot时，它会给出以下堆栈跟踪，

ScreenDesignerComponent.html:7 ERROR TypeError: Object(...) is not a function
    at ScreenDesignerComponent.push../src/components/screen-designer/screen-designer.component.ts.ScreenDesignerComponent.takeScreenshot (screen-designer.component.ts:76)
    at Object.eval [as handleEvent] (ScreenDesignerComponent.html:7)
    at handleEvent (core.js:10258)
    at callWithDebugContext (core.js:11351)
    at Object.debugHandleEvent [as handleEvent] (core.js:11054)
    at dispatchEvent (core.js:7717)
    at core.js:8161
    at HTMLDivElement.<anonymous> (platform-browser.js:995)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:421)
    at Object.onInvokeTask (core.js:3815)

任何指针都会有所帮助。预先感谢

Angular6和html2canvas-Object（...）不是函数

0 个答案: