当滚动页面时，Datepicker（matCalendar）angular2应该移动

Question

我正在使用一个日期选择器，当我点击日期选择器时，日历会打开，现在我需要的是，当我滚动页面时，日历应该沿着页面移动，有人会建议我如何执行此操作。我是angular2的新手。

Answer 1

您可以将日历包含在div中，并为其提供position fixed属性。

<div class="test">
    <mat-form-field>
        <input matInput [matDatepicker]="picker" placeholder="Choose a date">
        <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
        <mat-datepicker #picker></mat-datepicker>
    </mat-form-field>
</div>

.test {
  position: fixed;
}

Working demo