我想使用 CTRL + P 打印带分页符的角度组件

问题描述

我试过如下

项目结构

structure

需要打印作业摘要组件

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; } 
}

结果只显示第一页

result

解决方法

对我来说效果很好。

enter image description here

请确保您已将 css 文件添加到组件的 styleUrls 数组中。

例如:styleUrls: [ './app.component.css' ]

Stackbtitz 查看演示。点击在新窗口中打开进行检查。