javascript - PDF 格式的 HTML 表格
问题描述
我正在尝试PDF
使用JSPdf打印 HTML 表格。我的表有 20 列。因此,我无法打印整个表格。最后 4-6 列总是隐藏。有没有办法让隐藏的内容变得可见或降低?
HTML
<div class="table-responsive" >
<table class="table table-bordered">
<thead>
<tr>
<th>Year Lease</th>
<th>user Name</th>
<th>Total Rent</th>
<th>Other Income</th>
<th>Total Income</th>
<th>Avg Expenses at 4 %</th>
<th>Value Added Expense</th>
<th>Other Expense</th>
<th>Total Expense</th>
<th>NOI</th>
<th>CAP Rate</th>
<th>Interest Paid</th>
<th>Net Income</th>
<th>Principal</th>
<th>Yearly Cashflow</th>
<th>Yearly</th>
<th>DS Ratio</th>
</tr>
</thead>
<tbody *ngFor="let userInfo of user;index as i">
<tr>
<td>Year {{i+1}} Leased</td>
<td *ngFor="let user of userInfo.user">{{user.amount | currency}}</td>
<td>{{user.grossIncome | currency}}</td>
<td>{{user.otherIncome | currency }}</td>
<td>{{user.totalIncome | currency }}</td>
<td>{{user.totalExpense}}</td>
<td>{{user.valueAddedExpense | currency}}</td>
<td>{{user.otherExpense | currency}}</td>
<td>{{user.totalExpense | currency}}</td>
<td>{{user.netOperatingIncome | currency}}</td>
<td>{{user.capRate}}% </td>
<td>{{user.mortageInterest | currency}}</td>
<td>{{user.netIncome | currency}}</td>
<td>{{user.principle | currency}}</td>
<td>{{user.yearlyCashFlow | currency}}</td>
<td>{{user.yearly}} %</td>
<td>{{user.deptServiceRatio}} %</td>
</tr>
</tbody>
</table>
</div>
TS
var pdf = new jsPDF('p','pt', 'a3');
pdf.internal.scaleFactor = 1.40;
pdf.addHTML(this.print.nativeElement, 0, 0, {
pagesplit: true
}, ()=> {
pdf.save('Report-' + new Date() + '.pdf');
});
问题
之后还有 4 列CAP Rate
。请帮帮我
解决方案
Y 必须像这样设置您的 pdf 高度:
var width = pdf.internal.pageSize.getWidth();
var height = pdf.internal.pageSize.getHeight();
推荐阅读
- java - java dbcp2多线程连接访问
- python - 使用 iloc 在 pandas 数据框中选择值时保持浮点精度
- javascript - 为什么从 html 收集的数据没有传递给 JavaScript 类?
- php - 使用 ffmpeg 从视频中生成提取数量的缩略图
- wcf - 如何在调用另一个 SOAP 服务的 wcf 服务中设置 WSS -Time to Live 的值?
- java - 如何使用烟灰分析 .class 文件?
- progressive-web-apps - 如何为我的用户移除 Service Worker?
- android - 为什么生成的视图绑定 .inflate() 方法需要 root 参数?
- ios - ios 获取位置 react-native/Expo
- javascript - 如何在 React Native 中创建无组织的网格视图