如何增加角度 5 中 matdialogbox 的自动高度？

Question

  uploadFiles(): void {
    const dialogRef = this.dialog.open(AddNewFilesOrImagesComponent, {
      width: '620px',
      height : '100%',
    });
  }

如果高度 100% UI 看起来像这样（在上传按钮下不需要空格）

如果我以 px 为单位固定高度（它使 UI 可滚动）

   uploadFiles(): void {
    const dialogRef = this.dialog.open(AddNewFilesOrImagesComponent, {
      width: '620px',
      height : '250px',
    });
  }

我想要实际的这种类型，如果我选择文件它自动增加它的高度（当我选择图像时我想增加 matdialogbox 的自动高度）

原文由 Dharmesh 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

试试这个，它将为您的 matdialog 占据 页面的 完整高度

 uploadFiles(): void {
   const dialogRef = this.dialog.open(AddNewFilesOrImagesComponent, {
        width: '100%',
        minHeight: 'calc(100vh - 90px)',
        height : 'auto'
    });
 }

原文由 Ganesh 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

只要对话框的 html 包装在 mat-dialog-content 中，该对话框就会自动适应内容。 :

 <h1 mat-dialog-title>{{data.title}}</h1>
<div mat-dialog-content>...>
<div mat-dialog-actions>...>

原文由 RidRoid 发布，翻译遵循 CC BY-SA 4.0 许可协议