angular - 特定 div 上的 Mat 对话框

Question

我正在使用 angular 8 并使用 mat-dialog。现在，mat-dialog 覆盖层覆盖了整个页面，mat-dialog 位于页面中央，如下所示。

但我只希望 mat-dialog 覆盖在 div 上，覆盖层也应该只出现在父 div 上，即 mat-dialog 应该相对于父 div，如下图所示。这该怎么做？此外，它是一个响应式网页，因此添加 mat-dialog 和 overlay 的位置需要大量工作，并且在不同的屏幕尺寸下可能看起来不太好。如果无法使用 Angular Material ，请建议一些其他框架( Bootstrap 等)或其他方法。

.

Answer 1

您可以使用与 MatDialogRef 关联的 updatePosition 函数

this.dialogRef.updatePosition({ top: '25px', left: '25px', right:'25px', bottom:'25px' });

这将定位对话框。