I am currently working on an app that utilizes a QR code scanner. To implement this, I am using the ngx-scanner component, which is a modified version of Google's ZXing scanning library designed for Angular. However, I am encountering an issue where the camera view for the scanner does not load properly whenever I use the scanner component. Instead, I only see the same background screen from my app.
Below is the HTML and TypeScript code for my scanner component:
<zxing-scanner [enable]="scannerEnabled" (scanSuccess)="onScanSuccess($event)"></zxing-scanner>
<h1><strong> {{ result }} </strong></h1>
export class QrScannerComponent implements OnInit {
scannerEnabled = true;
result: string
constructor() {}
ngOnInit(): void {}
onScanSuccess(result: string) {
this.result = result
}
}