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

Question

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

如果高度100％的用户界面看起来像这样（在“上传”按钮下，则不必留空白）

如果我将固定高度设置为px（这会使UI滚动）

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

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

Answer 1

尝试此操作，您的height将花费页面的完整matdialog

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

        });
      }

Answer 2

对话框会自动适应内容，只要其 html 被写入 mat-dialog-content 内。 :

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

Answer 3

将一个类添加到对话框：

System.Net.Http 4.2.0

然后将以下样式添加到CSS中的类：

System.Net.Http 4.0.0