[英]How to hide Angular 9 background component for @media print while printing mat-dialog?
Here is my styles.css file, here app-labour-value-estimate-print-layout
is a mat-dialog component which is over app-material-details
component.这是我的 styles.css 文件,这里app-labour-value-estimate-print-layout
是一个垫子对话框组件,它位于app-material-details
组件之上。 When I try to print this mat-dialog, things from background pops out and so app-root > * { display: none;}
this helped.当我尝试打印这个 mat-dialog 时,后台的东西会弹出,所以app-root > * { display: none;}
这有帮助。 However when added this code, any other components are not displayed in print as they as nested in app-root
.但是,当添加此代码时,任何其他组件都不会显示在 print 中,因为它们嵌套在app-root
中。 How do I print root components as well as mat-dialog component without interference from background?如何在不受背景干扰的情况下打印根组件和 mat-dialog 组件?
@media print {
/*app-root > * {
display: none;
}*/
app-footer {
display: none;
}
app-labour-value-estimate-print-layout {
display: block;
}
app-material-details {
display: block;
}
}
Try this inside media-print在 media-print 里面试试这个
.cdk-overlay-pane {
width: 100%;
max-width: none;
}
mat-dialog-container {
width: 100vw;
height: 100%;
min-height: 100vh;
padding: 0;
margin: 0;
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.