我想使用 CTRL + P 打印带有分页符的 angular 组件
I want to print angular component with page break using CTRL + P
我试过如下
项目结构
需要打印作业摘要组件
HTML
<div>
<div>first page</div>
<div class="page-break"></div>
<div>second page</div>
</div>
CSS
@media print {
.page-break { page-break-before: always; }
}
结果只显示第一页
适合我。
请确保您已将 css 文件添加到组件的 styleUrls
数组中。
例如:styleUrls: [ './app.component.css' ]
在 Stackbtitz 查看演示。点击Open in New Window查看。
我试过如下
项目结构
需要打印作业摘要组件
HTML
<div>
<div>first page</div>
<div class="page-break"></div>
<div>second page</div>
</div>
CSS
@media print {
.page-break { page-break-before: always; }
}
结果只显示第一页
适合我。
请确保您已将 css 文件添加到组件的 styleUrls
数组中。
例如:styleUrls: [ './app.component.css' ]
在 Stackbtitz 查看演示。点击Open in New Window查看。