【问题标题】:Angular DateTime Format角度日期时间格式
【发布时间】:2019-04-10 03:55:31
【问题描述】:

我有这个带有日期时间字符串的 json 数组。我正在表格中填充这些数据。

[{"id":8,"startdate":"2018-02-01T00:00:00","enddate":"2018-02-28T23:59:59.9999999","created":"2018-02-15T12:58:43.3417189","filename":"data022018"},{"id":9,"startdate":"2019-03-01T00:00:00","enddate":"2019-03-31T23:59:59.9999999","created":"2019-03-15T12:59:45.1079351","filename":"data032019"},{"id":10,"startdate":"2019-04-01T00:00:00","enddate":"2019-04-30T23:59:59.9999999","created":"2019-04-08T12:58:43.3417189","filename":"data042019"}]

这是我表格中的 html 代码

<td>{{ archive.startdate | date: 'short' }} - {{ archive.enddate | date: 'dd/MM/yyyy' }}</td>

结果是

2/1/18, 12:00 AM - 01/03/2018 (just want to show i format with different methods)
1/4/2018 - 1/5/2018

我真正想要实现的是最后一个日期是当月的最后一天,而不是从下个月的第一天开始。

1/02/2018 - 28/02/2018

我做错了什么?我想取 enddate 日、月和年。

感谢@Wandrille 的回答

//model
export interface Archive {
    id?: string | number;
    startdate: string | Date; <-- use as string or date object
    enddate: string | Date;
    created: string | Date;
    filename: string;
}

 // component
 this.db.getFiles(
  this.currentPage,
  this.pageSize
  ).subscribe(result => {
    this.totalArchives = result.totalitems;
    this.archives = result.items.map(myitem => ({
      ...myitem,
      startdate: new Date(myitem.startdate), <-- after init as new date, date pipe work as expected
      enddate: new Date(myitem.enddate) <-- date pipe works
    }));
    if(this.totalArchives === '0' || this.totalArchives === 0) {
      this.toastr.info('No Files Yet', 'Waiting for files to generate');
    }

  });

【问题讨论】:

    标签: json angular datetime angular6 angular7


    【解决方案1】:

    您可以将日期字符串转换为日期。然后,它会工作(而且更清洁)

    this.archive = this.archive.map(item => (
       {
        ...item,
        startdate : new Date(item.startdate),
        endDate : new Date(item.endDate)
       }
    ))
    

    【讨论】:

      【解决方案2】:

      这是:之后的值

      这样试试

      {{ startdate.split(":")[0]| date: 'short'}} 
       <br>
      {{ enddate.split(":")[0]| date: 'short'}}
      

      查看详情here

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2020-12-22
        • 2015-05-27
        • 2016-05-06
        • 1970-01-01
        相关资源
        最近更新 更多