• 首先需要安装angular-qrcode :
bower install monospaced/angular-qrcode
npm install angular-qrcode
  • 如何使用?
    在相应的需要使用二维码的页面增加如下代码:

注意:这里的“version”和"size"可以根据github上面找出自己想要的结果:

生成含有图片的二维码:

这里没有angular插件方法,需要引入juquery的一个插件,插件在《我上传的文件》中:jquery.qrcode.min.js:

1、在相应页面html中:

2、在相应的controller中:

   function generateQRCode() {
vm.hostHref = location.href;//生成二维码
$('.QRCode').empty().qrcode({
image: $("#logoImg")[0],
imagesize: 0.15,
mode: 4,
render: "canvas",
size: 200,
text: vm.hostHref
}); //生成二维码
$('.logo').empty().qrcode({
image: $("#logoImg")[0],
imagesize: 0.15,
mode: 4,
render: "canvas",
size: 70,
text: vm.hostHref
});
}

六、angular 生成二维码的更多相关文章

  1. Angular生成二维码

    Installation - Angular 5+, Ionic NPM npm install angularx-qrcode --save Yarn yarn add angularx-qrcod ...

  2. Python 创建本地服务器环境生成二维码

    一. 需求 公司要做一个H5手机端适配页面,因技术问题所以H5是外包的,每次前端给我们源码,我们把源码传到服务器让其他人访问看是否存在bug,这个不是很麻烦吗?有人说,可以让前端在他们的服务器上先托管 ...

  3. JavaScript的学习--生成二维码

    有一些耗cpu的计算,完全可以在客户端上计算,比如生成二维码. qrcode其实是通过计算,然后使用jquery实现图形渲染和画图.支持canvas和table两种方式生成我们所需的二维码. 具体用法 ...

  4. java--实现将文字生成二维码图片,并在中间附上logo,下方附上文字

    前段时间因为工作需要,要实现将一段文字或者url生成二维码,然后中间附上logo,下方正中间附上文字的功能. 上网找了几篇教程学习了下,由于没有保存借鉴的博文链接,所以就没po上参考文章的链接啦,感谢 ...

  5. thinkphp整合系列之phpqrcode生成二维码

    php生成二维码其实挺简单的:当然指的是使用qrcode类库: 因此关于是否要写这篇博客:我是犹豫了再三的: 不过最后还是决定写下吧:如果有童鞋急着用:就可以直接引了: 再个也可以作为即将写的文章微信 ...

  6. ThinkPHP框架整合phpqrcode生成二维码DEMO

    ThinkPHP框架发展到今天功能已经变得是非常强大了,但是ThinkPHP框架中没有二维码相关的库,因此我们可以通过整合phpqrcode来完成生成二维码的功能.想使用phpqrcode首先就要把p ...

  7. thinkphp3.2集成QRcode生成二维码

    一.下载QRcode源代码 https://sourceforge.net/projects/phpqrcode/files/releases/ 使用phpqrcode必须开启GD2扩展,phpqrc ...

  8. Java与JS生成二维码

    1.二维码概念 二维码/二维条码是用某种特定的集合图形按一定规律在平面上(二维方向上)分布的黑白相间的图形记录数据符号信息的图片. 黑线是二进制的1,空白的地方是二进制的0,通过1.0这种数据组合用于 ...

  9. phporjquery生成二维码

    一.php生成二维码 下载文章末尾链接中phpcode文件 include "./phpqrcode/qrlib.php"; //QRcode::png('http://www.b ...

随机推荐

  1. 【NOI2019十二省联合省选】部分题简要题解

    Day 1 T1 异或粽子 题意:给出一个长为n的序列,选择K个不完全重合的区间使得每个区间的异或值的总和最大. 题解:先做一个前缀异或和,对于每一个右端点我们记录三元组(l,r,x)表示在左端点在\ ...

  2. 关于Nginx启动成功,浏览器不能访问的解决办法

    本人初学Nginx,第一天配置成功并能通过浏览器进行访问. 第二天重新打开,将Nginx启动,但是浏览器却访问不了. 执行 ps aux|grep nginx ,执行结果如下,的确Nginx服务已经启 ...

  3. 蓝桥杯-Anagrams问题

     算法训练 Anagrams问题   时间限制:1.0s   内存限制:512.0MB      问题描述 Anagrams指的是具有如下特性的两个单词:在这两个单词当中,每一个英文字母(不区分大小写 ...

  4. phpqrcode实现二维码(含图片)

    ---恢复内容开始--- 1,http://phpqrcode.sourceforge.net/ 下载 2,解压以后只需要一个文件 3,原生php测试: <?php include 'phpqr ...

  5. nginx安装及其配置详细教程

    1 nginx 介绍 1 什么是nginx Nginx是一款高性能的http 服务器/反向代理服务器及电子邮件(IMAP/POP3)代理服务器. 由俄罗斯的程序设计师Igor Sysoev所开发,官方 ...

  6. 部署rails遇到问题

    underfined method for has_attched_file when installing paperclip 解决 create the file paperclip.rb ins ...

  7. 10w定时任务,如何高效触发超时

    一.缘起 很多时候,业务有定时任务或者定时超时的需求,当任务量很大时,可能需要维护大量的timer,或者进行低效的扫描. 例如:58到家APP实时消息通道系统,对每个用户会维护一个APP到服务器的TC ...

  8. c#删除list中的元素

    public static void TestRemove() { string[] str = { "1", "2", "d", &quo ...

  9. hadoop学习笔记(一):hadoop生态系统及简介

    一.hadoop1.x的生态系统 HBase:实时分布式数据库 相当于关系型数据库,数据放在文件中,文件就放在HDFS中.因此HBase是基于HDFS的关系型数据库.实时性:延迟非常低,实时性高. 举 ...

  10. RabbitMQ---4、消息确认Ack

    一:消费者确认 消费者确认或者说消费者应答指的是RabbitMQ需要确认消息到底有没有被收到 - 自动应答 boolean autoAck = true; channel.basicConsume(Q ...