Javascript 使用jspdf将数组导出为表
我的数据格式如下Javascript 使用jspdf将数组导出为表,javascript,html,angular,jspdf,Javascript,Html,Angular,Jspdf,我的数据格式如下 [ {"Company":"XYZ1", "FName":"John", "LName": "Deere", "ID": 1234}, {"Company":"XYZ2", "FName":"Jack", "LName": "Jones", "ID": 2345}, {"Company":"XYZ3", "FName":"James", "LName": "Lebron", "ID": 3456} ] 是否有方法将相同的数据作为两个不同的表导出到PD
[
{"Company":"XYZ1", "FName":"John", "LName": "Deere", "ID": 1234},
{"Company":"XYZ2", "FName":"Jack", "LName": "Jones", "ID": 2345},
{"Company":"XYZ3", "FName":"James", "LName": "Lebron", "ID": 3456}
]
是否有方法将相同的数据作为两个不同的表导出到PDF文件中?我使用的是Angular 4和jsPDF包
表:1
**Company** **FName**
XYZ1 John
XYZ2 Jack
XYZ3 James
表格:2
**LName** **ID**
Deere 1234
Jones 2345
Lebron 3456
让我试着用一个例子来概括这个问题并简化答案, 我将创建一个示例表
The HTML file looks like....
<div id="render_me">
<div id="table">
<table id="StudentInfoListTable">
<thead>
<tr>
<th>Name</th>
</tr>
</thead>
<tbody>
<tr>
<td>Dani</td>
</tr>
</tbody>
</table>
</div>
<a href="#">Download Test PDF</a>
您可以使用jspdf和jspdf自动表以pdf格式下载。下面是同样的例子。您可以根据需要进行修改。。希望它能帮助你 在HTML中:
<a (click)="convert()">Generate PDF</a>
并使用以下功能:
convert() {
var doc = new jsPDF();
var col = ["Sr. No.","Details"];
var col1 = ["Details", "Values"];
var rows = [];
var rows1 = [];
/* The following array of object as response from the API req */
var itemNew = [
{ index:'1',id: 'Case Number', name : '101111111' },
{ index:'2',id: 'Patient Name', name : 'UAT DR' },
{ index:'3',id: 'Hospital Name', name: 'Dr Abcd' }
]
itemNew.forEach(element => {
var temp = [element.index,element.id];
var temp1 = [element.id,element.name];
rows.push(temp);
rows1.push(temp1);
});
doc.autoTable(col, rows, { startY: 10 });
doc.autoTable(col1, rows1, { startY: 60 });
doc.save('Test.pdf');
}
它将如下所示:
这正是我要找的。你救了我一天@Rak2018@Rak2018如果您能为此打开stackblitz演示,将不胜感激。我面临着这个问题。对于我来说,列标题未显示且无法显示多个属性
import * as jsPDF from 'jspdf';
import 'jspdf-autotable';
convert() {
var doc = new jsPDF();
var col = ["Sr. No.","Details"];
var col1 = ["Details", "Values"];
var rows = [];
var rows1 = [];
/* The following array of object as response from the API req */
var itemNew = [
{ index:'1',id: 'Case Number', name : '101111111' },
{ index:'2',id: 'Patient Name', name : 'UAT DR' },
{ index:'3',id: 'Hospital Name', name: 'Dr Abcd' }
]
itemNew.forEach(element => {
var temp = [element.index,element.id];
var temp1 = [element.id,element.name];
rows.push(temp);
rows1.push(temp1);
});
doc.autoTable(col, rows, { startY: 10 });
doc.autoTable(col1, rows1, { startY: 60 });
doc.save('Test.pdf');
}