Download the QRcode

[Yachos]

trafficstars

how to get the URL of the QRcode

[RuiEEE]

Any update on this? How to download a file containing the QR code?

[Yachos]

@RuiEEE, I'm getting the URL of the Canvas where I set my QR Code

HTML

<ngx-qrcode id="QR_Canvas" qrc-element-type="canvas" [qrc-value] =''>

TS

let something = document.querySelectorAll('canvas'), A = something as HTMLCanvasElement, somethinUrl = A.toDataURL("image/jpeg"); return somethinUrl.toString();

[agc93]

@techiediaries is there any more reliable method than the canvas-fetch that @Yachos mentions? Or any chance of a property/event binding we could use to get the data URL back?

[lolaswift]

@Yachos You solution didn't work for me. The type casting gave error.

[alejandrocen]

@lolaswift

HTML

<ngx-qrcode qrc-element-type="canvas" [qrc-value]="YOUR_DATA"></ngx-qrcode <button ion-button (click)="getImage()">Ver imagen</button>

TS

getImage(): void { const canvas = document.querySelector("canvas") as HTMLCanvasElement; const imageData = canvas.toDataURL("image/jpeg").toString(); alert(imageData); }

Tested on Ionic 3 :)

[MrTob]

thats works fine, but i want to share the qr-code, what do I have to do?

[kishoreaoe]

i am using this logic for downloading the QR code:-

saveQRCode() { const qrImageElement = document.getElementsByTagName("img")[0]; //as for me there is only one img tag in my view. const imageData = qrImageElement.src; //base64 data is inside the image element. const downloadLink = document.createElement("a"); downloadLink.href = imageData; downloadLink.download = this.salesUserName; downloadLink.click(); }