将时间戳日期转换为带月份名称的正确日期格式

Question

需要转换以下时间戳日期

var uploadDate = 2021-04-17T17:19:19.831Z

将转换为合适的日期格式，月份名称也像这样-04 Feb 2021

在.ts文件。在html

中不需要如何得到这样的this.uploadDate = 04 Feb 2021

Answer 1

在Angular中，你可以使用CommonModule

中的日期过滤器将日期格式化为字符串。组件内部:

this.myDate = "2021-04-17T17:19:19.831Z";

在视图中使用日期过滤器来设置日期格式

{{ myDate | date: 'dd MMM yyyy'}}

这将给你:

17 Apr 2021

有一个工作的例子在Stackblitz

在组件内部格式化日期

你也可以在组件中使用date管道，像注入其他依赖项一样注入它。

在你的模块中包含DatePipe

import { DatePipe } from "@angular/common";
@NgModule({
...
providers: [DatePipe]
})
export class AppModule {}

将它添加到组件的依赖项中:

import { DatePipe } from '@angular/common';

在你的组件中添加依赖项到你的类:

constructor(private datePipe: DatePipe) {}

然后你可以自由地在组件中设置日期格式:

this.datePipe.transform(this.date, "dd MMM yyyy")

Answer 2

var uploadDate = "2021-04-17T17:19:19.831Z";
var monthNames = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
var d = new Date(uploadDate);
var month = monthNames[d.getMonth()];
var day = String(d.getDate()).padStart(2, '0');
var year = d.getFullYear();
var formatedDate = day  + ' '+ month + ' ' + year;
console.log(formatedDate);

Answer 3

当然可以:

// first get Date from string
const getDateFromStr = (dateString) => new Date(Date.parse(dateString));
// setting options to format your Date
const dayFormatter = new Intl.DateTimeFormat('en', {
day: 'numeric',
month: 'short',
year: 'numeric',
});
// format your Date
dayFormatter.format(getDateFromStr('2021-04-17T17:19:19.831Z'));

在这里你可以找到更多关于Intl的信息。DateTimeFormat:

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat

关于date。parse

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/parse

Answer 4

使用Vanilla Js，我们可以使用toDateString()并调整它的结果一点，以获得所需的结果，我不知道这是否是最好的方法。

let dateArr = new Date("2021-04-17T17:19:19.831Z").toDateString().split(" "); // the array would look like [ 'Sat', 'Apr', '17', '2021' ]
dateArr.shift();  // removes the day(Sat) from the array
console.log(dateArr.join(" ")); // Output: Apr 17 2021