Angular Material CDK Overlay 滚动 block 在导航侧边栏中不起作用

标签 angular angular-material angular-cdk

我正在向 mat-sidenav 添加 CDK 覆盖。当覆盖层打开时,我想阻止在 mat-sidenav 上滚动。

我创建覆盖滚动阻止:

const overlayConfig = new OverlayConfig({
  scrollStrategy: this.overlay.scrollStrategies.block(),
});

const overlayRef = this.overlay.create(overlayConfig);

我没有对 mat-sidenav 做任何特别的事情,因为它默认是可滚动的。

这是一个显示问题的堆栈 Blitz 。您应该能够滚动侧边导航,然后打开并覆盖并注意侧边导航仍然是可滚动的

https://stackblitz.com/edit/angular-z68qqg

enter image description here

最佳答案

您必须在可滚动容器上添加 cdk-scrollable 指令,如本期所述
https://github.com/angular/components/issues/6157

关于Angular Material CDK Overlay 滚动 block 在导航侧边栏中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60579334/

相关文章:

javascript - 如何从 typescript 文件附加 html 并在 angular2 中对其执行功能

Angular Material 2 Reactive Forms -- mat-error with *ngIf 在验证 minLength、电子邮件和所需的验证工作时未显示

angular - 如何访问禁用输入的值?

angular - formArray 中的可拖动 formGroups(响应式(Reactive)表单)

angular - 使用 jasmine spy 测试 cdk 覆盖

javascript - 如何将 ngbDatepicker 日期格式从 JSON 更改为 YYYY/MM/DD

node.js - Angular 6 many Can't resolve errors (crypto, fs, http, https, net, path, stream, tls, zlib)

angular - 使用 ngFor 处理自定义指令 - Angular2

css - Angular Material 触摸屏滚动问题

Angular 8 拖放 - 将文件或文件夹拖放到另一个文件夹中