Angular 材质：md-datepicker CSS 显示问题答案

【问题标题】：Angular Material: md-datepicker CSS display issueAngular 材质：md-datepicker CSS 显示问题
【发布时间】：2015-10-05 20:12:54
【问题描述】：

我已升级到 Angular Material 0.11.1。我正在使用 Angular JS v1.4.6。我正在尝试实现新的日期选择器功能。我遇到的问题是当我使用如下标准代码时：

<md-content>
<h4>Standard date-picker</h4>
<md-datepicker ng-model="myDate" md-placeholder="Enter date"></md-datepicker>
</md-content>

当我选择选择器时，我遇到了一个奇怪的显示问题，其中一半屏幕是灰色的，并且可以看到日期选择器框的一部分。一旦执行此操作并尝试使用弹出框选择其他任何内容，就会发生同样的事情。有谁知道为什么会发生这种情况以及如何解决？

以下图片：

【问题讨论】：

【解决方案1】：

我自己也遇到了同样的问题，每次我点击打开md-datepicker时，我的页面底部都会出现一个大白块。

在花了一些时间监视单击md-datepicker 时的页面行为后，我意识到单击md-datepicker 时，angular material 正在动态更改我的 css 中 <html> 和 <body> 类的 css 样式样式表，像这样：

<body class="" style="position: fixed; width: 100%; top: -231px;">

<html lang="en" style="overflow-y: scroll;">

作为一个快速修复，我设置了我的 body 类，以覆盖动态更改：

body {
top: 0px !important;
}

希望这将帮助其他人解决同样的问题。

【讨论】：

【解决方案2】：

我遇到了同样的问题并在md-datepicker 中应用了以下标签，对我来说一切正常:)

style="position:fixed;"

【讨论】：