Angular表格的导入导出

接下来，咱们看看在component.ts中的代码具体该怎么写呢？

• 导入excel值

• @param info 索引值

*/

import(info:any){

this.filename=“”; //文本框中的值为空

this.display=true;

}

/**

• 下载模板

*/

down(){

let url=“http://192.168.22.202:8080/basicInfo-web/student/downStudentTemplateForLibrary”;

window.open(url);

URL.revokeObjectURL(url);

}

/**

• 显示选择文件的框

• @param el

*/

show(el:HTMLElement){

el.click();

}

/**

• @param event 选中文件

*/

selectedFileOnChanged(event:any){

//打印文件选择名称

console.log(event);

console.log(event.target.value);

this.filename=event.target.value;

}

/**

• 导入数据excel：初始化

*/

public uploader :FileUploader=new FileUploader({

url:“http://192.168.22.202:8080/achievement-web/singleScoreManage/addUsualScore/%E4%B8%8A%E7%9A%84/%E8%AF%95%E8%AF%95%E6%89%8B”,

method:“POST”,

itemAlias:“multfile”,

allowedFileType:[“xls”,“xlxs”]

});

upload(){

if (this.filename==“”){

alert(“没有选择文件，请选择文件”);

return;

}

this.uploadFile();

this.display=false;

}

uploadFile(){

//上传

this.uploader.queue[0].onSuccess =function(response, status, headers){

//上传文件成功

if(status==200){

//上传文件后后去服务器返回的数据

let tempRes = JSON.parse(response);

console.log(tempRes);

alert(“上传成功”);

}else{

//上传文件后湖区服务器返回的数据错误

alert(“失败”);

}

};

this.uploader.queue[0].upload();

}

在上传文件的时候应该首先下载模板，然后在模板中输入自己要导入的文件，上传即可。

在导入的过程中用到了两个地址，一个是下载模板的地址，一个是上传文件的地址，这两个是不同的地址。

导出

在导出的过程中，代码就简单多了，就不需要用模态框了，在HTML中也就不需要写代码了。直接在ts中写导出的代码就可以了。

最后

自我介绍一下，小编13年上海交大毕业，曾经在小公司待过，也去过华为、OPPO等大厂，18年进入阿里一直到现在。

深知大多数Java工程师，想要提升技能，往往是自己摸索成长，自己不成体系的自学效果低效漫长且无助。

因此收集整理了一份《2024年Java开发全套学习资料》，初衷也很简单，就是希望能够帮助到想自学提升又不知道该从何学起的朋友，同时减轻大家的负担。

既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，基本涵盖了95%以上Java开发知识点，不论你是刚入门Java开发的新手，还是希望在技术上不断提升的资深开发者，这些资料都将为你打开新的学习之门！

如果你觉得这些内容对你有帮助，需要这份全套学习资料的朋友可以戳我获取！！

由于文件比较大，这里只是将部分目录截图出来，每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频，并且会持续更新！
断提升的资深开发者，这些资料都将为你打开新的学习之门！**

如果你觉得这些内容对你有帮助，需要这份全套学习资料的朋友可以戳我获取！！

由于文件比较大，这里只是将部分目录截图出来，每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频，并且会持续更新！