Angular 8：材质对话框的最大高度属性不起作用

Question

我正在 Angular 8 中开发一个项目，其中我使用 MatDialog 在对话框中打开带有表单输入的新组件。例如：

import {MatDialog} from '@angular/material/dialog';

import {AddDialogComponent} from '../add-dialog.component';

constructor(private dialog: MatDialog){
}

private addNewRow() {

    const dialogRef = this.dialog.open(AddDialogComponent, {

      width: 'auto',
      height: 'auto',
      maxHeight: '100vh',
      maxWidth:'100vw',
      data: Data
    });
    dialogRef.afterClosed().subscribe(
      result => {

         // statements
      });
  }

在这里，当对话框打开时，maxWidth: '100vw'工作正常，但不支持maxHeight: '100vh' 。还尝试了maxHeight: '100vh !important'并尝试从 .css 文件更改样式。

两者都不起作用。对于此问题的任何建议或解决方案将受到高度赞赏。

谢谢。

Answer 1

这是因为.mat-dialog-content有一个max-height: 65vh. 您可以决定不使用该指令，或者在 css 中覆盖它：

.mat-dialog-content {
  max-height: initial;
}

工作示例