我想使用 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查看。