1.0.1 • Published 3 years ago
@just-so-so/ngx-qrcode v1.0.1
NgxQrCode
It is based on qrcode, you can use NgxQrCodePopoverDirective to show QrCode Popover on element, also you can use NgxQrCodeComponent as qrcode wrapper.
Please see demo.
Import:
import { NgxQrcodeModule } from '@just-so-so/ngx-qrcode';NgxQrCodePopoverDirective
<span ngx-qrcode-popover [qrCodeOptions]="qrCodeOptions" [qrData]="'any text'" [direction]="'left'">NgxQrCodeOptions
export interface NgxQrCodeOptions {
version?: number;
errorCorrectionLevel?: QRCodeErrorCorrectionLevel;
toSJISFunc?: (codePoint: string) => number;
margin?: number;
scale?: number;
width?: number;
color?: {
dark?: string;
light?: string;
};
}| Property | Description |
|---|---|
| qrCodeOptions | NgxQrCodeOptions |
| direction | 'top','right','bottom','left' |
| qrData | QR code content data |
| (onError) | EventEmitter<Error> |
| (onSuccess) | EventEmitter<HTMLCanvasElement> |
NgxQrCodeComponent
<ngx-qrcode [qrData]="'any text'"></ngx-qrcode>| Property | Description |
|---|---|
| version | same with qrcode version |
| errorCorrectionLevel | same with qrcode errorCorrectionLevel |
| toSJISFunc | same with qrcode toSJISFunc |
| margin | same with qrcode margin |
| scale | same with qrcode scale |
| width | same with qrcode width |
| colorDark | same with qrcode color.dark |
| colorLight | same with qrcode color.light |
| dataUrlType | same with qrcode type, values are 'image/png' , 'image/jpeg' , 'image/webp' |
| rendererQuality | same with qrcode rendererOpts.quality |
| qrData | QR code content data |
| outputType | 'img','canvas','url' |
| (onError) | EventEmitter<Error> |
| (onSuccess) | EventEmitter<string,HTMLImageElement,HTMLCanvasElement> |
NgxQrCodeService
| Method | Description |
|---|---|
| (toCanvas) | toCanvas(qrData: any, qrOptions: NgxQrCodeOptions, element?: any): Promise<HTMLCanvasElement> |
| (toDataURL) | toDataURL(qrData: any, qrOptions: NgxQrCodeToDataURLOptions, element?: any): Promise<string> |