I'm building a cordova application using ionic framework. This application need the ability to generate a QRcode based on the given text. I found http://davidshimjs.github.io/qrcodejs/ as a solution. But I could not implement this in my ionic application. I need some example for this task, implemented by qrcodejs, or any other libraries.Thanks!
Ionic cordova - QRcode generate example
15k views Asked by supper aban_89 At
3
There are 3 answers
5
On
Neither angular-qr nor angular-qrcode worked for me, so I ended up rolling my own directive real quick, based on Shim Sangmin's QRCode generator library:
<!-- index.html -->
<script src="lib/qrcode.js/qrcode.js"></script>
-
// directives.js
.directive('qrcode', function($interpolate) {
return {
restrict: 'E',
link: function($scope, $element, $attrs) {
var options = {
text: '',
width: 128,
height: 128,
colorDark: '#000000',
colorLight: '#ffffff',
correctLevel: 'H'
};
Object.keys(options).forEach(function(key) {
options[key] = $interpolate($attrs[key] || '')($scope) || options[key];
});
options.correctLevel = QRCode.CorrectLevel[options.correctLevel];
new QRCode($element[0], options);
}
};
});
Then use it like so:
<qrcode text="{{something.on.scope}}" color-bright="#ff0000"></qrcode>
<!-- or width, height, color-dark, correct-level -->
Edit: Check it out on JSFiddle.
So what you need is a angular module, most the time you would have to create your own directive, module, or angular code to integrate a JavaScript plug-in. But someone has already done that, I would take a look at http://ngmodules.org/modules/angular-qr should be what you are looking for. See the demo: http://janantala.github.io/angular-qr/demo/