启用主页面滚动时，角材质对话框打开

Question

我有一个要求，我将有我的材料对话框，当我打开它时，我不会在对话框上有一个垂直的滚动条，相反，我将只使用主页面(对话框打开的页面)滚动，现在发生的事情是，它阻止了主页面的任何滚动运动。

检查stackblitz链接

所以如果你在上面看到stackblitz对话框有很多内容是不可见的，因为我不能使用主页面滚动向下滚动。它阻塞了主页面滚动，注意，我不希望滚动框本身。可惜这不是我的要求

Answer 1

您应该在对话框打开时添加滚动策略作为选项。我更改了您的openDialog()函数如下，以包括滚动策略。

export class DialogContentExample {
constructor( public dialog: MatDialog, private overlay: Overlay ) {}
openDialog() {
const dialogRef = this.dialog.open(DialogContentExampleDialog, {
scrollStrategy: this.overlay.scrollStrategies.noop()
}); //Added the strategy, after first constructing the variable containing it
dialogRef.afterClosed().subscribe(result => {
console.log(`Dialog result: ${result}`);
});
}
}

您还需要导入库:import { Overlay } from "@angular/cdk/overlay";

这是你的重构stackblitz的例子。