I have been facing certain difficulties with the qrcode camera for some time. I have a login page and I want that when the user clicks on the read button qr the ion-content of the login page becomes transparent and a close reading button appears in the footer however I did not succeed. Follow attempts:
My method Structure
lerQR() {
this.qrScanner.prepare()
.then((status: QRScannerStatus) => {
if (status.authorized) {
this.leuQR.next(1);
document.getElementsByTagName("ion-content")[0].style.opacity = "0";
this.qrScanner.show();
this.qrScan = this.qrScanner.scan().subscribe((text: string) => {
console.log('Scanned something', text);
});
} else if (status.denied) {
this.qrScanner.openSettings()
} else {
// permission was denied, but not permanently. You can ask for permission again at a later time.
}
})
.catch((e: any) => console.log('Error is', e));
}
Attempt 1:
Run qrScanner.show command and then hide ion-content with getelement;I can read qr code but I can't see camera:
In this attempt I can see the camera but I cannot read the qr code, receiving the following error:
Error is TypeError: Cannot read properties of undefined (reading 'style')
at api.service.ts:683:60
at ZoneDelegate.invoke (zone-evergreen.js:364:1)
at Object.onInvoke (core.js:27558:1)
at ZoneDelegate.invoke (zone-evergreen.js:363:1)
at Zone.run (zone-evergreen.js:123:1)
at zone-evergreen.js:857:1
at ZoneDelegate.invokeTask (zone-evergreen.js:399:1)
at Object.onInvokeTask (core.js:27546:1)
at ZoneDelegate.invokeTask (zone-evergreen.js:398:1)
at Zone.runTask (zone-evergreen.js:167:1)
How can I display the camera and read the qrcode hiding the ion-content since I have a stop reading button in the footer?
I have been facing certain difficulties with the qrcode camera for some time. I have a login page and I want that when the user clicks on the read button qr the ion-content of the login page becomes transparent and a close reading button appears in the footer however I did not succeed. Follow attempts:
My method Structure
Attempt 1:
Run qrScanner.show command and then hide ion-content with getelement;I can read qr code but I can't see camera:
Attempt 2:
Hiding ion-content from the login page with get element and then calling qrscanner.show() command;I can read qr code but I can't see camera:
Attempt 3:
Removing two layers of ion-content (Remembering that I only have the login page) and then giving the qrscanner.show()
In this attempt I can see the camera but I cannot read the qr code, receiving the following error:
How can I display the camera and read the qrcode hiding the ion-content since I have a stop reading button in the footer?
Enviroment settings: