使用 Dynamic Web TWAIN 与 Angular 8 集成答案

【问题标题】：Using Dynamic Web TWAIN integrate with angular 8使用 Dynamic Web TWAIN 与 Angular 8 集成
【发布时间】：2020-12-31 09:27:22
【问题描述】：

我在我的扫描仪中使用 Dynamsoft Web TWAIN。我收到以下代码错误，

HTML代码-

<button (click)="acquireImage()">Scan Document</button>
<div id="dwtcontrolContainer"></div>

Angular 代码 -

acquireImage(): void {
  const dwObject = Dynamsoft.WebTwainEnv.GetWebTwain('dwtcontrolContainer');
  dwObject.IfShowIndicator = false;
  const bSelected = dwObject.SelectSource();
  if (bSelected) {
    const onAcquireImageSuccess = () => { dwObject.CloseSource(); };
    const onAcquireImageFailure = onAcquireImageSuccess;
    dwObject.OpenSource();
    dwObject.AcquireImage({}, onAcquireImageSuccess, onAcquireImageFailure);
  }

}

【问题讨论】：

错误是什么..？
ERROR TypeError: Cannot read property 'SelectSource' of null
也许这有帮助：github.com/Dynamsoft/Dynamic-Web-TWAIN/issues/6
这个错误怎么办ERROR ReferenceError: DVS is not defined
其他解决方案对您有帮助吗？

标签： javascript angular twain dynamsoft

【解决方案1】：

Dynamic Web TWAIN 的命名空间已更改。可以参考最新的示例代码https://github.com/Dynamsoft/dwt-angular-simple/blob/master/src/app/dwt/dwt.component.ts

初始化动态 Web TWAIN 对象：

ngOnInit(): void {
 Dynamsoft.DWT.Containers = [{ WebTwainId: 'dwtObject', ContainerId: this.containerId, Width: '300px', Height: '400px' }];
 Dynamsoft.DWT.RegisterEvent('OnWebTwainReady', () => { this.Dynamsoft_OnReady(); });                                                        
 Dynamsoft.DWT.ResourcesPath = 'assets/dwt-resources';
   Dynamsoft.DWT.ProductKey = 't00891wAAAKBfWo4sRRVNTyLqdC7nKomEJIfBYqfXWg5mblnP0eeJi+LsMIUdQvrBf//ocS3z8MJA47R4VdO4x24uJwlqKgkuZOa7BUQHPkFNA5hFSi6lG2qOK6I=';
 let checkScript = () => {
   if (Dynamsoft.Lib.detect.scriptLoaded) {
     Dynamsoft.DWT.Load();
   } else {
     setTimeout(() => checkScript(), 100);
   }
 };
 checkScript();
}

Dynamsoft_OnReady(): void {
 this.DWObject = Dynamsoft.DWT.GetWebTwain(this.containerId);
 this.bWASM = Dynamsoft.Lib.env.bMobile || !Dynamsoft.DWT.UseLocalService;
 if (this.bWASM) {
   this.DWObject.Viewer.cursor = "pointer";
 } else {
   let sources = this.DWObject.GetSourceNames();
   this.selectSources = <HTMLSelectElement>document.getElementById("sources");
   this.selectSources.options.length = 0;
   for (let i = 0; i < sources.length; i++) {
     this.selectSources.options.add(new Option(<string>sources[i], i.toString()));
   }
 }
}

从扫描仪获取图像：

acquireImage(): void {
    if (!this.DWObject)
      this.DWObject = Dynamsoft.DWT.GetWebTwain();
    if (this.bWASM) {
      alert("Scanning is not supported under the WASM mode!");
    }
    else if (this.DWObject.SourceCount > 0 && this.DWObject.SelectSourceByIndex(this.selectSources.selectedIndex)) {
      const onAcquireImageSuccess = () => { this.DWObject.CloseSource(); };
      const onAcquireImageFailure = onAcquireImageSuccess;
      this.DWObject.OpenSource();
      this.DWObject.AcquireImage({}, onAcquireImageSuccess, onAcquireImageFailure);
    } else {
      alert("No Source Available!");
    }
  }

【讨论】：