以 Mon dd yyyy 格式显示日期

Question

我正在从我的 API 中获取出生日期的值。我需要在 3 种不同的文本框中显示它，例如 jan ,01 和 2000。

如何在 TS 中尝试。

我尝试将出生日期字段存储在 Date 变量中。但它给出的值类似于 Sat Jan 01 2000 00:00:00 GMT-0500。 而不是我需要三个值 2000 年 1 月 1 日和 2000 年。

我尝试了日期管道，它给了我像 Jan-01-2000 这样的日期。

 this.newDate=new Date(this.patient.dateOfbirth);

Answer 1

如果您想在输入字段中显示它，我建议您像下面一样在类本身中解析日期并在输入字段中使用它：

1. 对于年份，您可以：newDate.getFullYear()
2. 对于月份，创建月份名称数组，例如：let monthNames = ['Jan', 'Feb', ..., 'Dec']，从日期获取月份索引并使用它来获取月份名称monthNames[newDate.getMonth()]
3. 日期，newDate.getDate()

如果您想在 HTML 模板中简单地显示日期，您可以使用Angular Datepipe，如下所示：

1. 一年，{{newDate | date:'yyyy'}}
2. 一个月，{{newDate | date:'MMM'}}
3. 日期，{{newDate | date:'dd'}}

Answer 2

检查离子日期时间组件 https://ionicframework.com/docs/api/components/datetime/DateTime/

你可以像这样做你想做的事：

代码

dateToShow : any;

this.newDate=new Date(this.patient.dateOfbirth);
dateToShow = newDate.toISOString();

模板

<ion-datetime displayFormat="MMM/DD/YYYY" [(ngModel)]="dateToShow"></ion-datetime>

Answer 3

如果可能，请尝试管道

有一些预定义的，比如

'mediumDate'：相当于'MMM d, y'（2015 年 6 月 15 日）。 “longDate”：相当于“MMMM d, y”（2015 年 6 月 15 日）。 'fullDate'：相当于 'EEEE, MMMM d, y'（2015 年 6 月 15 日，星期一）

使用： {{ 日期对象 |日期：'mediumDate' }}

如果基本款不适合你，你可以添加costum pipe。

{{ 值 |管道：'args'}}

https://angular.io/api/common/DatePipe