Angular material 对话框不滚动

Question

我使用包含数字输入的 material 对话框。在移动视图中，当键盘打开时我无法滚动对话框内容，所以我看不到输入的数字。我该怎么办？

数字输入在键盘下方我看不出可以输入什么。请帮助我

Answer 1

我通过在 material 对话框打开时添加一些 class 解决了这个问题

html:

<div class="parent-container" [class.noscroll]="openOverlay == true">
   ...........
</div>

css:

.noscroll {
  position: fixed;
  overflow: hidden;
}

Answer 2

.cdk-global-overlay-wrapper {
  pointer-events: auto !important; // be able to scroll event
  overflow-y: scroll !important;
  align-items: start !important;  // not center the dialog
  z-index: auto !important; // remove z-index
}
.cdk-overlay-pane {
  margin: 1rem; //enter code here
  z-index: 1002; // over the overlay
}

Angular material 对话框不滚动

Angular material doesn't dialog scroll

angular-material

responsive

angular