- Notifications
You must be signed in to change notification settings - Fork62
An Angular 9/10 Component Library for Generating QR (Quick Response) Codes
License
techiediaries/ngx-qrcode
Folders and files
| Name | Name | Last commit message | Last commit date | |
|---|---|---|---|---|
Repository files navigation
! ⚠️ WARNING: The NPM package ngx-qrcode2 has been deprecated. Use @techiediaries/ngx-qrcode instead.@techiediaries/ngx-qrcode An Angular Component library for Generating QR (Quick Response ) Codes.
You can use the@techiediaries/ngx-qrcode to easily generate QR codes inside your Angular 6 or Ionic 3 applications
QR code (abbreviated from Quick Response Code) is the trademark for a type of matrix barcode (or two-dimensional barcode) first designed for the automotive industry in Japan. A barcode is a machine-readable optical label that contains information about the item to which it is attached. A QR code uses four standardized encoding modes (numeric, alphanumeric, byte/binary, and kanji) to efficiently store data; extensions may also be used.Source
Note: Make sure to check10xdev.space for career growth, money making tips and learning paths for developers.
To use ngx-qrcode in your project, install it via npm or yarn:
$ npm install @techiediaries/ngx-qrcode --saveor$ yarn add @techiediaries/ngx-qrcode
For a complete and detailed tutorial on how to use this library. See:
How to Generate QR Codes In Angular 4+ Applications
ImportNgxQRCodeModule from@techiediaries/ngx-qrcode into yourapp.module.ts:
import{BrowserModule}from'@angular/platform-browser';import{NgModule}from'@angular/core';import{NgxQRCodeModule}from'@techiediaries/ngx-qrcode';import{AppComponent}from'./app.component';@NgModule({declarations:[AppComponent],imports:[BrowserModule,NgxQRCodeModule],providers:[],bootstrap:[AppComponent]})exportclassAppModule{}
Once the library has been imported, you can use the ngx-qrcode component in your Angular application.
Inapp.component.html, add:
<divstyle="text-align:center"><h1> @techiediaries/ngx-qrcode demo</h1></div><ngx-qrcode[elementType]="elementType"[value]="value"cssClass="aclass"errorCorrectionLevel="L"></ngx-qrcode>
Inapp.component.ts, add:
import{Component}from'@angular/core';@Component({selector:'app-root',templateUrl:'./app.component.html',styleUrls:['./app.component.css']})exportclassAppComponent{title='app';elementType='url';value='Techiediaries';}
Please seeContributing Guidelines.
To generate all*.js,*.d.ts and*.metadata.json files:
$ npm run buildor$ yarn build
To lint all*.ts files:
$ npm run lintor$ yarn lint
In development mode:
$ npm run test:watch ngx-qrcodeor$ yarn test:watch ngx-qrcode
Add--codeCoverage option to see code coverage incoverage folder.
$ npm run lib:publishor$ yarn lib:publish
Please seeCode of Conduct.
With Angular CLI 8.X.X you should add this lines to polyfills.ts
// Needed by Buffer needed by QRCode// tslint:disable-next-line:no-string-literal(windowasany)['global']=window;
About
An Angular 9/10 Component Library for Generating QR (Quick Response) Codes
Topics
Resources
License
Code of conduct
Contributing
Uh oh!
There was an error while loading.Please reload this page.
Stars
Watchers
Forks
Packages0
Uh oh!
There was an error while loading.Please reload this page.
Contributors7
Uh oh!
There was an error while loading.Please reload this page.