ZXingScannerModule 似乎不适用于 Angular

Question

我创建了一个新项目并试图让二维码扫描仪工作，但我无法让它工作。 这是包含整个项目的公共存储库。 https://github.com/JoeY34kaze/ngx_not_working/tree/main

我正在学习本教程 https://github.com/zxing-js/ngx-scanner/wiki

我在 app.component.html 中遇到错误

.html 文件是

<zxing-scanner
  #scanner
  [formats]="['QR_CODE', 'EAN_13']"
  (camerasFound)="cameraFound($event)"
  (camerasNotFound)="camerasNotFound($event)"
  (scanSuccess)="scanSuccessHandler($event)"
>
</zxing-scanner>

错误是

'zxing-scanner' is not a known element:
1. If 'zxing-scanner' is an Angular component, then verify that it is part of this module.
2. If 'zxing-scanner' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.

应用模块是

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppComponent } from './app.component';
// the scanner!
import { ZXingScannerModule } from '@zxing/ngx-scanner';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    ZXingScannerModule

  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

app.componet.ts 是

import { Component, OnInit } from '@angular/core';
import { ZXingScannerModule } from '@zxing/ngx-scanner';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {
  scannerEnabled = true;
  result: string

  constructor() {}

  ngOnInit(): void {}

  camerasNotFound(e: Event) {
    // Display an alert modal here
  }

  cameraFound(e: Event) {
    // Log to see if the camera was found
  }

  onScanSuccess(result: string) {
    console.log(result);
  }
}

Answer 1

尝试导入 CUSTOM_ELEMENTS_SCHEMA 并将其添加到 app.module.ts 文件中 NgModule 部分的 schemas 数组中

import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
@NgModule({
schemas: [ CUSTOM_ELEMENTS_SCHEMA ]
})