angular中使用file-saver导出文件详细步骤(前端html导出word文档)

file-saver

一、安装

npm install file-saver --save
# 如使用TS开发,可安装file-saver的TypeScript类型定义
npm install @types/file-saver --save-dev

二、使用方法,在ts文件中导入 saveAs

import {saveAs} from 'file-saver';

三、详细代码贴出

html:

<button nz-button nzType="primary" (click)="exportWord(getPreViewHtml())">导出</button>
<div #exportHtmlToWord>
  <div class="export-html" style="font-size:18px">

    <h4 style="text-align:center">关于实施临时静默管理的通告</h4>

    实施临时静默管理。现将相关事宜通告如下:<br>
    一、静默管理范围1111<br>
    二、静默管理期间222<br>
    三、静默管理期间333<br>
    四、静默管理期间44444<br>
    五、静默管理期间555<br>
    六、静默管理期间56666<br>
    七、辖区居民出现发热、咳嗽等症状,要第一时间向村(社区)报告,按照疫情防控有关规定到发热门诊就诊,严禁瞒报、漏报、迟报。<br>
    八、广大市民群众积极配合,不造谣传谣,不发布不实信息,共同维护良好社会秩序。<br>

  </div>
</div>

ts:

import {AfterViewInit, Component, ElementRef, OnInit, ViewChild} from '@angular/core';
import {saveAs} from 'file-saver';
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值