1 首先使用npm下载插件依赖的安装包

  npm install file-saver --save
  npm install xlsx --save
 
2 引入项目中的ts文件中
  import * as FileSaver from 'file-saver';
  import * as XLSX from 'xlsx';
 
3  写一个exportList(){ }方法,点击导出按钮时执行此方法,导出文件
  exportList() {

   // json 示例

    let json = [{"姓名": "***", "工號": "***", "英文名": "***", "部门": "**", "性别": "1", "手机": "+861**********",

       "个人邮箱": "****@**.com"
      }];

     let json = this.linuxRow;
//linuxRow是要导出的json数据,可以根据选择来命名
const worksheet: XLSX.WorkSheet = XLSX.utils.json_to_sheet(json);
const workbook: XLSX.WorkBook = {
Sheets: { data: worksheet },
SheetNames: ['data']
};
const excelBuffer: any = XLSX.write(workbook, {
bookType: 'xlsx',
type: 'array'
});
//这里类型如果不正确,下载出来的可能是类似xml文件的东西或者是类似二进制的东西等
this.saveAsExcelFile(excelBuffer, 'linux安装详情');
}
private saveAsExcelFile(buffer: any, fileName: string) {
const data: Blob = new Blob([buffer], {
type:
'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=UTF-8'
});
FileSaver.saveAs(data, fileName + '_' + new Date().getTime() + '.xlsx');
// 如果写成.xls,可能不能打开下载的文件,这可能与Excel版本有关
}
   

angular6 导出json数据到excal表的更多相关文章

  1. 通过js获取前台数据向一般处理程序传递Json数据,并解析Json数据,将前台传来的Json数据写入数据库表中

    摘自:http://blog.csdn.net/mazhaojuan/article/details/8592015 通过js获取前台数据向一般处理程序传递Json数据,并解析Json数据,将前台传来 ...

  2. 结合Bootbox将后台JSON数据填充Form表单

    本文介绍了如何结合Bootbox将后台JSON数据填充到Form表单中,同时也介绍了一些需要使用的知识的学习途径,并附上了参考文档地址与学习网址,对此感兴趣的伙伴可以直接访问学习.为了方便介绍,使用了 ...

  3. 《项目经验》--通过js获取前台数据向一般处理程序传递Json数据,并解析Json数据,将前台传来的Json数据写入数据库表中

      先看一下我要实现的功能界面:   这个界面的功能在图中已有展现,课程分配(教师教授哪门课程)在之前的页面中已做好.这个页面主要实现的是授课,即给老师教授的课程分配学生.此页面实现功能的步骤已在页面 ...

  4. vue 导出JSON数据为Excel

    1. 安装三个依赖 npm install file-saver --save npm install xlsx --save npm install script-loader --save-dev ...

  5. PHP导出大量数据到csv表

    对于做后台开发的码农来说,从excel导入数据到数据库亦或者是从数据库导出数据到excel都是很常见的操作.由于经常遇到这样的场景,也因为从数据库导出数据到表格所遇到的坑有很多,所以需要另辟途径来进行 ...

  6. 导出数据库数据到Excel表

    后台需要将用户信息数据导入到Excel表中提供给相关人员: 首先查询数据就不多说了: 导入Excel表直接亮代码(采用的是jxl的jar包提供的方法): public static File Impo ...

  7. Vue导出json数据到Excel表格

    一.安装依赖 npm install file-saver --save npm install xlsx --save npm install script-loader --save-dev 二. ...

  8. 导出大量数据到excel表

    set_time_limit(0);error_reporting(0); // 输出Excel文件头,可把user.csv换成你要的文件名header('Content-Type: applicat ...

  9. 导出excel时,以form方式提交json数据

    今天在写项目时写到一个excel的导出,开始想用ajax请求后台后导出,但发现ajax会有返回值,而且ajax无法直接输出文件,而后台的excel导出方法已经封装好,不方便修改. 就改用了提交的方式f ...

随机推荐

  1. Tomcat并发优化和缓存优化

    Tomcat并发优化 1.调整连接器connector的并发处理能力 在Tomcat 配置文件 server.xml 中的 <Connector ... /> 配置中 1.参数说明 max ...

  2. CSS3绘制特殊图形

  3. 电子签名在K2中的应用

    全球越来越多的企业开始使用电子签名(即eSignatures),在减少碳排放的同时简化业务流程,提高文档安全性,便于记录保存,并降低企业成本.在美国法律下,电子签名具备等同于手写签名的法律效力. 什么 ...

  4. getString与optString的区别

    JSONObject.getString("key"):当对象中没有key属性的时候,会抛出No value for "key"的异常: public Stri ...

  5. linux发布环境初始化脚本

    #参数配置 homeDir=$(pwd) tomcatDir=$homeDir/tomcat logDir=$homeDir/tomcat/logs backUpDir=$homeDir/backup ...

  6. hive表分区操作

    1.修复表分区命令 msck repair table table_name; 2.添加表分区操作 alter table table_name add partition(month_id='201 ...

  7. pytest自动化1:兼容unittest代码实例

    初级版本 源码: #!/usr/bin/env python # -*- coding:utf-8 -*- #使用车管家的接口实际调用类函数 import unittest from urllib i ...

  8. 芯片烧录器编程AT24C02

    网上买了两款芯片烧录器,因为项目用的到.芯片以后的类型可能是IIC 接口的.就选则了一个IIC接口的AT24C02EEPROM.进行尝试.手头上没有这款芯片. 就想起自己单片机上有这款芯片.然后就开始 ...

  9. spring cloud 工程构建

    https://blog.csdn.net/zhou199252/article/details/80745151 https://blog.csdn.net/forezp/article/detai ...

  10. 使用lua实现99乘法口诀表,就这么简洁

    for i=1,9 do for j=1,i do io.write(j,"*",i,"=",i*j," ") end print() en ...