How to generate a QR code in ionic

I’m new on Ionic. I’m developing a app which will be able to scan and generate a QR Code.
However , i have tried to code on many examples but it cant run. Please help me to give me a guide which can help me to code the app. Thank you for any help or information :smiley:.

1 Like

i tried to code it but i have a problem with (ngx-qrcode). cant blind to ‘qrc-value’ since it is not a known property of ‘ngx-qrcode’

Ok. Was a naff implementation as witnessed when watched.

Here’s my effort (created just now).

Look in the home.ts to see it hand-crafted using the qrcode plugin

4 Likes

Please like or mark as ‘solution’ where appropriate

1 Like

I have a problem with the plugin, when I try to install it everything die.

npm WARN deprecated node-uuid@1.4.7: Use uuid module instead

> grpc@1.9.0 install C:\Users\s.summo\Documents\Sviluppo\GLT Mobile\node_modules\grpc
> node-pre-gyp install --fallback-to-build --library=static_library

node-pre-gyp ERR! Tried to download(undefined): https://storage.googleapis.com/grpc-precompiled-binaries/node/grpc/v1.9.0/node-v57-win32-x64-unknown.tar.gz
node-pre-gyp ERR! Pre-built binaries not found for grpc@1.9.0 and node@8.9.1 (node-v57 ABI, unknown) (falling back to source compile with node-gyp)
gyp ERR! configure error
gyp ERR! stack Error: Can't find Python executable "python", you can set the PYTHON env variable.
gyp ERR! stack     at PythonFinder.failNoPython (C:\Users\s.summo\Documents\Sviluppo\GLT Mobile\node_modules\node-gyp\lib\configure.js:483:19)
gyp ERR! stack     at PythonFinder.<anonymous> (C:\Users\s.summo\Documents\Sviluppo\GLT Mobile\node_modules\node-gyp\lib\configure.js:508:16)
gyp ERR! stack     at C:\Users\s.summo\Documents\Sviluppo\GLT Mobile\node_modules\graceful-fs\polyfills.js:284:29
gyp ERR! stack     at FSReqWrap.oncomplete (fs.js:152:21)
gyp ERR! System Windows_NT 10.0.15063
gyp ERR! command "C:\\Program Files\\nodejs\\node.exe" "C:\\Users\\s.summo\\Documents\\Sviluppo\\GLT Mobile\\node_modules\\node-gyp\\bin\\node-gyp.js" "configure" "--fallback-to-build" "--library=static_library" "--module=C:\\Users\\s.summo\\Documents\\Sviluppo\\GLT Mobile\\node_modules\\grpc\\src\\node\\extension_binary\\node-v57-win32-x64-unknown\\grpc_node.node" "--module_name=grpc_node" "--module_path=C:\\Users\\s.summo\\Documents\\Sviluppo\\GLT Mobile\\node_modules\\grpc\\src\\node\\extension_binary\\node-v57-win32-x64-unknown"
gyp ERR! cwd C:\Users\s.summo\Documents\Sviluppo\GLT Mobile\node_modules\grpc
gyp ERR! node -v v8.9.1
gyp ERR! node-gyp -v v3.6.2
gyp ERR! not ok
node-pre-gyp ERR! build error
node-pre-gyp ERR! stack Error: Failed to execute 'C:\Program Files\nodejs\node.exe C:\Users\s.summo\Documents\Sviluppo\GLT Mobile\node_modules\node-gyp\bin\node-gyp.js configure --fallback-to-build --library=static_library --module=C:\Users\s.summo\Documents\Sviluppo\GLT Mobile\node_modules\grpc\src\node\extension_binary\node-v57-win32-x64-unknown\grpc_node.node --module_name=grpc_node --module_path=C:\Users\s.summo\Documents\Sviluppo\GLT Mobile\node_modules\grpc\src\node\extension_binary\node-v57-win32-x64-unknown' (1)
node-pre-gyp ERR! stack     at ChildProcess.<anonymous> (C:\Users\s.summo\Documents\Sviluppo\GLT Mobile\node_modules\node-pre-gyp\lib\util\compile.js:83:29)
node-pre-gyp ERR! stack     at emitTwo (events.js:126:13)
node-pre-gyp ERR! stack     at ChildProcess.emit (events.js:214:7)
node-pre-gyp ERR! stack     at maybeClose (internal/child_process.js:925:16)
node-pre-gyp ERR! stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:209:5)
node-pre-gyp ERR! System Windows_NT 10.0.15063
node-pre-gyp ERR! command "C:\\Program Files\\nodejs\\node.exe" "C:\\Users\\s.summo\\Documents\\Sviluppo\\GLT Mobile\\node_modules\\node-pre-gyp\\bin\\node-pre-gyp" "install" "--fallback-to-build" "--library=static_library"
node-pre-gyp ERR! cwd C:\Users\s.summo\Documents\Sviluppo\GLT Mobile\node_modules\grpc
node-pre-gyp ERR! node -v v8.9.1
node-pre-gyp ERR! node-pre-gyp -v v0.6.39
node-pre-gyp ERR! not ok
Failed to execute 'C:\Program Files\nodejs\node.exe C:\Users\s.summo\Documents\Sviluppo\GLT Mobile\node_modules\node-gyp\bin\node-gyp.js configure --fallback-to-build --library=static_library --module=C:\Users\s.summo\Documents\Sviluppo\GLT Mobile\node_modules\grpc\src\node\extension_binary\node-v57-win32-x64-unknown\grpc_node.node --module_name=grpc_node --module_path=C:\Users\s.summo\Documents\Sviluppo\GLT Mobile\node_modules\grpc\src\node\extension_binary\node-v57-win32-x64-unknown' (1)
npm WARN @angular/compiler-cli@5.0.1 requires a peer of typescript@>=2.4.2 <2.5 but none is installed. You must install peer dependencies yourself.
npm WARN @angular/core@5.0.1 requires a peer of zone.js@^0.8.4 but none is installed. You must install peer dependencies yourself.
npm WARN angularfire2@5.0.0-rc.5-next requires a peer of zone.js@^0.8.0 but none is installed. You must install peer dependencies yourself.
npm WARN ngx-qrcode2@0.0.5 requires a peer of @angular/core@^4.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN ngx-qrcode2@0.0.5 requires a peer of zone.js@^0.8.4 but none is installed. You must install peer dependencies yourself.
npm WARN tsickle@0.24.1 requires a peer of typescript@2.4.2 but none is installed. You must install peer dependencies yourself.
npm WARN tsutils@1.9.1 requires a peer of typescript@>=2.0.0 || >=2.0.0-dev || >=2.1.0-dev || >=2.2.0-dev || >=2.3.0-dev || >= 2.4.0-dev but none is installed. You must install peer dependencies yourself.

Have you cloned my git repo and attempted to run?

I have solved with another plugin

Can you please tell me the detail of your solution?

Look at my link. I show you how to do it!

Hi, i’m trying to pass an array object but getting ‘invalid data’. is it not possible?

You need to feed it strings. Hopefully, JSON.stringify(array) will work for your situation.

hi, thanks for the suggestion, it works

1 Like

Hi, qrcode encode work for me, but in the video he doesn’t console.log() anything yet some base64 string show up. I want to take that sting, any idea where i can find it?

How to Create swipable Table in Ionic?