如何解决使用Primeng动态对话框打开全屏模式
我正在使用PrimeNg模态扩展在我正在使用的Angular Webapp之一中显示模态弹出窗口。我将组件传递给模态服务,如以下代码所示:
const ref = this.dialogService.open(LogsComponent,{
data: {
releaseID:row.release_id
},header:'Migration Logs',width:'100%',height:'100%'
});
我得到了我通过的ID
,并且能够在模式中显示表格。现在的问题是,即使我给出100%
的宽度和高度,模态也不会显示为全屏。我希望模态最大化,因为它适用于PrimeNg对话框。
解决方法
将其放入styles.css。如果您只想要一个对话框,那么它将接受所有对话框,然后提供自定义类并使用自定义类名称更改ui-dialog
.ui-dialog {
max-height: 100%;
}
.ui-dialog .ui-dialog-content {
height: 100%;
}
带有自定义类
const ref = this.dialogService.open(LogsComponent,{
data: {
releaseID:row.release_id
},header:'Migration Logs',width:'100%',height:'100%',styleClass:"customModal"
});
和styles.css
中.customModal {
max-height: 100%;
}
.customModal .ui-dialog-content {
height: 100%;
}
,
您可以在对话框中使用 maximizable='true'
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。