角材料2自动完成位置错误答案

【问题标题】：Angular material 2 autocomplete position wrong角材料2自动完成位置错误
【发布时间】：2017-12-29 19:58:41
【问题描述】：

我对材料 2 的自动完成有疑问。

在我的例子中，当用户在输入中写下某些内容时，我会填充列表，但带有选项的 div(panel) 总是出现在下面（如果屏幕很小，我必须向下滚动页面）。当屏幕很小时，它应该出现在输入字段的上方。

我认为问题在于面板的位置仅在单击输入时才在开始时初始化。任何人都可以帮助我解决任何问题吗？有没有办法在列表更新时重置 positionY？

谢谢

【问题讨论】：

欢迎来到 SO。为了便于理解和帮助，请参阅如何提问stackoverflow.com/help/how-to-ask.

标签： angular angular-material2

【解决方案1】：

对我来说，问题是项目中缺少核心 css 类。

[修复] style.css，在顶层，添加：

@import '~@angular/material/prebuilt-themes/deeppurple-amber.css';

【讨论】：

【解决方案2】：

尝试将其添加到您的 style.css

.cdk-overlay-container{position:fixed;z-index:1000}
.cdk-global-overlay-wrapper{display:flex;position:absolute;z-index:1000}
.cdk-overlay-pane{position:absolute;pointer-events:auto;box-sizing:border-
 box;z-index:1000}

【讨论】：

不，它不能解决我的问题，我的 css 中已经包含了这个属性，除了我找不到的 .cdk-global-overlay-wrapper 类。但是我添加了 3 并且它仍然以相同的方式工作。无论如何，感谢您的尝试。
在为每种样式添加 ::ng-deep 后将其正确定位。但是现在 cdk-overlay-container 在选择项目后不会被删除：/
我回来说这只是部分修复。