angular版 二維碼組件

歡迎關注github:https://github.com/myopenresources

angular版 二維碼組件cc-qrcode

安裝

npm install cc-qrcode --save 或 yarn add cc-qrcode

使用

// 業務模塊

import { BrowserModule } from '@angular/platform-browser';

import { NgModule } from '@angular/core';

import { QrcodeModule } from 'cc-qrcode';

 

import { AppComponent } from './app.component';

 

@NgModule({

  declarations: [

    AppComponent

  ],

  imports: [

    BrowserModule,

    QrcodeModule

  ],

  providers: [],

  bootstrap: [AppComponent]

})

export class AppModule { }

 

//業務html

<div>

  <cc-qrcode [value]="'123456789'"></cc-qrcode>

</div>

 

參數

1. value：二維碼值

2. background：背景顏色，默認白色

3. foreground：前景顏色，默認黑色

4. backgroundAlpha：背景透明度

5. foregroundAlpha：前景透明度

6. level：二維碼級別，默認L

7. mime：生成的圖片類型，默認image/png

8. padding：內邊距

9. size：二維碼大小（寬高）

10. canvas：是否使用畫布生成，默認爲false，圖片方式