Angular6二维码组件

需求：

     Angular6框架下可以根据内容生成对应的二维码。

方案：

     这个我们直接使用 angular2-qrcode插件就可以。

具体使用过程：

1、首先安装 angular2-qrcode

npm install angular2-qrcode

 2、其次，在app.module.ts中引入QRCodeModule 模块

import { NgModule } from '@angular/core'; import { QRCodeModule } from 'angular2-qrcode'; ... @NgModule({ imports: [ QRCodeModule, ... ] })

3、然后，在html模板文件中定义二维码展现的元素

<div> <qr-code [value]="'All QR Code data goes here!'" [size]="150"></qr-code> </div>

4、参数说明：

AttributeTypeDefaultDescriptionvalueString''Your data stringsizeNumber100This is the height/width of your QR Code componentlevelString'L'QR Correction level ('L', 'M', 'Q', 'H')backgroundString'white'The color for the backgroundbackgroundAlphaNumber1.0The opacity of the backgroundforegroundString'black'The color for the foregroundforegroundAlphaNumber1.0The opacity of the foregroundmimeString'image/png'The mime type for the output imagepaddingNumbernullThe padding around the QR CodecanvasBooleanfalseWill output a canvas element if true

结束。

参考文档：https://www.npmjs.com/package/angular2-qrcode