CODEWITHSUNDEEP
angularionic-frameworkqr-code
Ayush Sahu
Ayush Sahu

Reputation: 266

Implement the QR Scanner in ionic

I am new in ionic so, I have not great knowledge about Ionic-framework, I am trying to implement the Cordova-plugin-QR scanner but it's showing the following error on my console.

enter image description here

and there is my code 

import { Component, OnInit } from '@angular/core';
import { QRScanner, QRScannerStatus } from '@ionic-native/qr-scanner/ngx';

@Component({
  selector: 'app-notification',
  templateUrl: './notification.page.html',
  styleUrls: ['./notification.page.scss'],
})

export class NotificationPage implements OnInit {
    constructor(private qrScanner: QRScanner  ) {
    }

ngOnInit(){
  this.qrScanner.prepare()
  .then((status: QRScannerStatus) => {
     if (status.authorized) {
       // camera permission was granted


       // start scanning
       let scanSub = this.qrScanner.scan().subscribe((text: string) => {
         console.log('Scanned something', text);

         this.qrScanner.hide(); // hide camera preview
         scanSub.unsubscribe(); // stop scanning
       });

     } else if (status.denied) {
       // camera permission was permanently denied
       // you must use QRScanner.openSettings() method to guide the user to the settings page
       // then they can grant the permission from there
     } 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));
   }
}

Upvotes: 0

Views: 1380

Answers (1)

Calvin R
Calvin R

Reputation: 66

You need to set the QRScanner provider in app.module.ts

import { QRScanner } from '@ionic-native/qr-scanner/ngx';

@NgModule({
  ...

  providers: [
    ...
    QRScanner
    ...
  ]
  ...
})
export class AppModule { }

Upvotes: 5

Related Questions