angular2材质2 Datepicker – 输出日期格式

发布时间：2020-12-17 17:36:22 所属栏目：安全来源：网络整理

导读：我在angular4项目中使用了 https://material.angular.io/components/component/datepicker.如何在输入框中用“2017年5月29日”等短格式格式化所选日期.目前显示为2017年5月29日示例代码： md-input-container input mdInput readonly="true" [mdDatepicker]

我在angular4项目中使用了 https://material.angular.io/components/component/datepicker.如何在输入框中用“2017年5月29日”等短格式格式化所选日期.目前显示为2017年5月29日

示例代码：

<md-input-container>
  <input mdInput readonly="true" [mdDatepicker]="startDatePicker" [mdDatepickerFilter]="myFilter" [min]="minDate" [max]="maxDate" class="date-text ng-dirty ng-valid-parse ng-touched ng-not-empty ng-valid ng-valid-required" placeholder="Choose a date">
  <button mdSuffix [mdDatepickerToggle]="startDatePicker" class="date-icon"></button>
</md-input-container>

<md-datepicker #startDatePicker [dateFormat]="'LL'" startView="month" [startAt]="currentDate"></md-datepicker>

TS：

@ViewChild('startDatePicker') startDatePicker: MdDatepicker<Date>;

PS. [dateFormat] =“’LL’”无效

解决方法

您不能轻易地设置日期格式. Material 2 Datepicker API中没有此类属性,更改格式的唯一正确方法是提供您自己的 DateAdapter实现.官方文档没有提供任何相关说明.现在只有一个基本的 implementetion,它根据语言环境定义格式.有很多抱怨,很快就会有更多的适配器.您可以尝试使用基于 this issue-thread的moment.js或只是等待.

您还可以使用区域设置在Datepicker中获取不同的格式.但这只是一个解决方法,直到一个正确的官方解决方案来：

export class AppModule {
  constructor(private dateAdapter:DateAdapter<Date>) {
    dateAdapter.setLocale('de'); // DD.MM.YYYY
  }
}

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!