Question

＆＃13;

echo

＆＃13;

import {Component, Inject, Input, ElementRef, OnInit} from '@angular/core';
declare let QRCode: any;
@Component({
  selector: 'app-qrcode',
  templateUrl: './qrcode.component.html',
  styleUrls: ['./qrcode.component.scss']
})
export class QrcodeComponent implements OnInit {
  elementType : 'url' | 'canvas' | 'img' = 'url';
  value:any; 
  constructor() 
  {}

  ngOnInit() {
    this.value  = 'WWW.Google.com';
  }

}

＆＃13;

我需要生成qr-code，我已经这样做了，但是想要改变qr-code的TYPE意味着什么。当我们扫描qr-code时，联系人详细信息会自动添加联系人详细信息，＆＃34;获取方向＆＃34;对于Map Qr-Code，电子邮件类型将定向到我们的邮箱和PDF下载功能。

Answer 1

您不必更改内容的类型，假设您要编码包含电子邮件的值或另一个包含网址的值，这不是此类型的含义。只有用户的设备才能决定是否或如何处理qrcode的有效负载（值）。

此处输入表示“呈现为canvas-tag”或“呈现为img-Tag”。

更长篇：

如果查看lib的源代码，则将elementType传递给switch语句，该语句本身默认为（对于url＆amp; img）为img。由于没有关于包网站本身上的elementType的文档，我查看了名为qrcode的基础包上的示例

来自qrcode文档： toCanvas（canvas）=将qr代码符号绘制到画布上。 toDataURL（img，url）=返回QR码的字符串表示形式。目前仅适用于SVG。

因此，如果不深入研究lib本身，它应该像编写一样简单，将编码后的电子邮件作为qrcode，以图像标记呈现。

<ngx-qrcode [qrc-element-type]="img" [qrc-value]="mailto:test@example.com"></ngx-qrcode>

由于qrc-element-type默认为“toDataURL”，你可以省略它（没有测试过这个）或者需要一些附加值来围绕你的值。

免责声明：我是另一个名为angularx-qrcode的QR码软件包的作者，该软件包适用于Angular4,5和6。

我为angular5 / 6制作了一个可用的演示应用程序： https://github.com/Cordobo/angularx-qrcode-sample-app

如何在Angular 5（Typescript）中生成不同类型的QR码

1 个答案: