1200字范文,内容丰富有趣,写作的好帮手!
1200字范文 > html页面生成图片angular 前端学习笔记:angular4中将html导出为pdf

html页面生成图片angular 前端学习笔记:angular4中将html导出为pdf

时间:2019-11-19 08:08:10

相关推荐

html页面生成图片angular 前端学习笔记:angular4中将html导出为pdf

ngular5中将html导出为pdf

1.安装pdfmake:

npm install pdfmake --save

2.在ts文件中导入:

import * as pdfMake from 'pdfmake/build/pdfmake';

import * as pdfFonts from 'pdfmake/build/vfs_fonts';

3.测试pdfmake:

pdfMake.vfs = pdfFonts.pdfMake.vfs;

var dd = { content:{text:"HelloWorld!",alignment: 'center',};

pdfMake.createPdf(dd).download();

4.处理中文问题:

a.找到需要的字体文件(后缀.ttf);

b.将pdfmake的源代码克隆或下载到本地,(/bpampuch/pdfmake);

c.进入pdfmake根目录,安装gulp,使用命令为

npm install gulp --save-dev;

d.安装pdfmake所需要的依赖包,使用命令:

npm install;

e.将自己所需要的字体放在pdfmake目录下的examples/fonts的目录中;

f.然后在执行:

gulp buildFonts ;

g.f步骤完成后会在build 文件夹中找到vfs_fonts.js

h.用pdfmake项目中的vfs_fonts.js替换原来项目中的vfs_fonts.js

5.使用字体:(以“微软雅黑”为例)

pdfMake.fonts = {

微软雅黑: {

normal: '微软雅黑.ttf',

bold: '微软雅黑.ttf',

italics: '微软雅黑.ttf',

bolditalics: '微软雅黑.ttf',

}

};

var dd = { content:{text:"HelloWorld!",alignment: 'center',font: '微软雅黑'};

pdfMake.createPdf(dd).download();

6.其他操作可以参考官网

https://juejin.im/

标签:pdfMake,微软,vfs,fonts,angular4,html,pdf,pdfmake,雅黑

来源: /ahu666/p/12850887.html

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。