javascript - MatSelect 打开时如何滚动底层 MatDialog？

Question

打开 MatSelect 时在常规页面中，可以通过 MAT_SELECT_SCROLL_STRATEGY 自定义滚动行为注入(inject) token 并使用 NoopScrollStrategy为了滚动底层页面，同时保持 MatSelect到位。
然而，当 MatSelect正在从 MatDialog 打开, MAT_SELECT_SCROLL_STRATEGY完全没有效果，我无法滚动底层 MatDialog .
我创建了一个 Stackblitz来证明问题。
一种解决方法是设置 backDropClass与 pointer-events: none但是当我单击它时，它也会禁用关闭行为，我想保留它。我还想避免基于 z-index 的黑客攻击如果可能的话。

Answer 1

当我使用纯 CSS 单击外部菜单时，我尝试关闭 matSelect 但无法找到方法。所以我不得不在 ts 文件中进行代码更改。
我编辑了你stackblitz在这里，它似乎正在工作。请验证..
在您的全局 style.css/scss 文件中添加以下代码将允许您在 matselect 打开时滚动对话框，并且还可以在外部单击时关闭对话框:

.cdk-overlay-backdrop.cdk-overlay-backdrop-showing {
  pointer-events: none;
}

.cdk-overlay-dark-backdrop {
  pointer-events: auto !important;
}

要在菜单外单击时关闭 matSelect，必须更改 .ts 代码。请参阅stackblitz链接。