角度材料日期时间选择器 - 使用日期和 24 小时时间格式化输入答案

【问题标题】：angular material date-time picker - format the input with date and 24 hour time角度材料日期时间选择器 - 使用日期和 24 小时时间格式化输入
【发布时间】：2020-11-06 21:41:06
【问题描述】：

我正在使用https://www.npmjs.com/package/@angular-material-components/datetime-picker 用于我的 angular material.io 应用程序的日期时间选择器

我想将我的日期输入格式化为现在以 24 小时格式显示时间(02/15/2020 21:05) 输入 -->

文档讨论了通过扩展 NgxMatDateAdapter 创建自定义适配器，但要扩展它，我必须在该类中实现 20 个函数。任何帮助表示赞赏。

【问题讨论】：

标签： angular angular-material

【解决方案1】：

我认为这会对你有所帮助..

您应该设置一个选项enableMeridian。
因为这个enableMeridian 的意思是：Whether to display 12H or 24H mode.，如果true or false 是它的值。默认为false..

所以我认为你的代码会是这样的..

const CUSTOM_DATE_FORMATS: NgxMatDateFormats = {
  parse: {
    dateInput: "l, LTS"
  },
  display: {
    dateInput: "l, LTS",
    monthYearLabel: "MMM YYYY",
    dateA11yLabel: "LL",
    monthYearA11yLabel: "MMMM YYYY",
    enableMeridian: true
  }
};

你可以参考这个链接。
https://www.npmjs.com/package/@angular-material-components/datetime-picker

【讨论】：

【解决方案2】：

使用stackblitz 获取答案。

import {MAT_DATE_FORMATS} from '@angular/material';
export const MY_FORMATS = {
  parse: {
    dateInput: 'LL',
  },
  display: {
    dateInput: 'YYYY-MM-DD',
    monthYearLabel: 'YYYY',
    dateA11yLabel: 'LL',
    monthYearA11yLabel: 'YYYY',
  },
};

在您的组件提供程序中编写代码

 providers: [
       {provide: MAT_DATE_FORMATS, useValue: MY_FORMATS},
  ]

【讨论】：

【解决方案3】：

我不认为它是直接可用的。如果你想实现这一点，你可以阅读下面的文章。

https://medium.com/@amandeepkochhar/angular-material-datepicker-set-custom-date-in-dd-mm-yyyy-format-5c0f4340e57

【讨论】：