Techiediaries/ngx-qrcode: An Angular 9/10 Component ... - GitHub

Trang chủ » Ngx-qrcode 2 Github » Techiediaries/ngx-qrcode: An Angular 9/10 Component ... - GitHub

Có thể bạn quan tâm

@techiediaries/ngx-qrcode ! ⚠️ 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 check 10xdev.space for career growth, money making tips and learning paths for developers.

How to install @techiediaries/ngx-qrcode?

To use ngx-qrcode in your project, install it via npm or yarn:

$ npm install @techiediaries/ngx-qrcode --save or $ yarn add @techiediaries/ngx-qrcode

How to use @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

Import NgxQRCodeModule from @techiediaries/ngx-qrcode into your app.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] }) export class AppModule { }

Once the library has been imported, you can use the ngx-qrcode component in your Angular application.

In app.component.html, add:

<div style="text-align:center"> <h1> @techiediaries/ngx-qrcode demo </h1> </div> <ngx-qrcode [elementType]="elementType" [value]="value" cssClass="aclass" errorCorrectionLevel="L"> </ngx-qrcode>

In app.component.ts, add:

import { Component } from '@angular/core'; @Component({ selector: 'app-root', templateUrl: './app.component.html', styleUrls: ['./app.component.css'] }) export class AppComponent { title = 'app'; elementType = 'url'; value = 'Techiediaries'; } Contributing

Please see Contributing Guidelines.

How to develop @techiediaries/ngx-qrcode?

To generate all *.js, *.d.ts and *.metadata.json files:

$ npm run build or $ yarn build

To lint all *.ts files:

$ npm run lint or $ yarn lint

How to run unit tests?

In development mode:

$ npm run test:watch ngx-qrcode or $ yarn test:watch ngx-qrcode

Add --codeCoverage option to see code coverage in coverage folder.

How to publish libraries?

$ npm run lib:publish or $ yarn lib:publish Code of Conduct

Please see Code of Conduct.

License

MIT © Techiediaries

Troubleshoots

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 (window as any)['global'] = window;

Từ khóa » Ngx-qrcode 2 Github