Angular Material MatDatePicker - 如何使其保持打开状态并将其与输入字段分开

时间:2018-05-01 11:08:40

标签: angular datepicker angular-material

我正在使用Angular Material的MatDatePicker。

最好我只想使用日期选择器中的日期选择视图,而不需要打开它的输入字段。

我还想让datepicker保持打开状态,因此它静态地是视图的一部分。

目前,datepicker设置如下:

<input type="text" matInput [matDatepicker]="datePickerFrom" readonly name="fromDate" [(ngModel)]="lookup.FromDate" #fromDate="ngModel">
<mat-datepicker #datePickerFrom [opened]="true" [startView]="'month'">
</mat-datepicker>

datepicker启动按预期打开,但由于它位于前台,当用户点击除日期选择器本身以外的任何其他位置时,它将关闭。

此外,datepicker需要输入字段 - 预期用途是从输入字段打开日期选择器,并使用datepicker视图选择日期。是否可以仅使用datepicker视图来选择数据,而不使用输入字段?

也许Angular Material Date Picker不是出于此目的的方式,所以任何替代方案都可能是这个问题的真正答案。

1 个答案:

答案 0 :(得分:2)

导入MatDatePickerModule,但使用<mat-calendar></mat-calendar>组件