打字稿將對象字符串轉換為日期格式mm / dd / yyyy

Question

我有很多不同的對象。 它們是字符串，它們是從api中輸入的

const data =   [
      {
        id: 1,
        fruit: “apple”,
        createdOn: "2016-09-02T23:00:00.000Z",
        submittedDate: "2016-09-11T23:00:00.000Z”
      },
      {
        id: 2,
        fruit: “banana”,
        createdOn: "2016-09-11T23:00:00.000Z”,
        submittedDate: "2016-09-11T23:00:00.000Z”
      },
      {
        id: 3,
        fruit: “cherry”,
        createdOn: "2016-09-13T23:00:00.000Z",
        submittedDate: "2016-09-11T23:00:00.000Z”

      },
    ]
 this.gridData = data

我將此對象數組分配給解析出數據的網格。 在將其發送到網格之前，如何將這些字符串日期轉換為mm / dd / yyyy格式？

編輯：所以我可以有一個數組的數據具有動態創建的日期字段。 目前，在我的示例中，我為您提供了日期字段名稱（createdOn，submittedDate），但是我可以擁有一個不知道字段名稱是什么的數組。

我們確實有一種方法可以識別這些字段，因為我們的命名約定要求所有日期字段都以“ Dt”結尾。 因此，既然我知道一個字段將是基於“ Dt”字符串的日期，那么如何動態更改數據？

Answer 1

 const data = [{ id: 1, fruit: "apple", createdOn: "2016-09-02T23:00:00.000Z", submittedDate: "2016-09-11T23:00:00.000Z" }, { id: 2, fruit: "banana", createdOn: "2016-09-11T23:00:00.000Z", submittedDate: "2016-09-11T23:00:00.000Z" }, { id: 3, fruit: "cherry", createdOn: "2016-09-13T23:00:00.000Z", submittedDate: "2016-09-11T23:00:00.000Z" }, ]; const dataWithDT = [{ id: 1, fruit: "apple", createdDt: "2016-09-02T23:00:00.000Z", submittedDt: "2016-09-11T23:00:00.000Z" }, { id: 2, fruit: "banana", createdDt: "2016-09-11T23:00:00.000Z", submittedDt: "2016-09-11T23:00:00.000Z" }, { id: 3, fruit: "cherry", createdDt: "2016-09-13T23:00:00.000Z", submittedDt: "2016-09-11T23:00:00.000Z" }, ]; function getMMDDYYYY(date) { var today = new Date(date); var dd = today.getDate(); var mm = today.getMonth() + 1; var yyyy = today.getFullYear(); if (dd < 10) dd = '0' + dd if (mm < 10) mm = '0' + mm return mm + '/' + dd + '/' + yyyy; } const formatData = data.map(val => { val.createdOn = getMMDDYYYY(val.createdOn); val.submittedDate = getMMDDYYYY(val.submittedDate); return val; }) const formatDataWithDt = data.map(val => { for (var keys in val) { if (keys.includes("Dt")) { val[keys] = getMMDDYYYY(val.createdOn); val[keys] = getMMDDYYYY(val.submittedDate); } } return val; }) console.log(formatDataWithDt); 

Answer 2

要在Angular中格式化日期，可以使用Date pipe 。

編輯

進口管道：

import { CurrencyPipe, DatePipe, DecimalPipe } from @angular/common';

在構造函數中設置它們：

constructor(        
        private _curency: CurrencyPipe,
        private _decimal: DecimalPipe,
        private _date: DatePipe,
    ) { }

用代碼稱呼他們：

let amount = this._decimal.transform(this.invoice.amount, '1.2-2');

之前： 100 ，之后100.00

let date = this._date.transform(this.invocie.date, 'dd.MM.yyyy HH:mm:ss')

之前： 2016-09-11T23:00:00.000Z之后： 11.06.2016 23:00:00

Answer 3

我的方法基本上是將所有內容拼接在一起，以創建所需的任何類型的格式。 我會使用角度定制管道，盡管那樣，您可以在應用程序中的任何地方使用它，而不必擔心創建用於容納該方法的服務。 這樣，在您的html中，您可能會遇到以下情況：

<p>Here's my date data {{ data.date | myCustomPipe}}</p>

無論如何，我的解決方案如下，盡管我更喜歡映射的想法：

 const data = [ { id: 1, fruit: 'apple', createdOn: "2016-09-02T23:00:00.000Z", submittedDate: "2016-09-11T23:00:00.000Z" }, { id: 2, fruit: 'banana', createdOn: "2016-09-11T23:00:00.000Z", submittedDate: "2016-09-11T23:00:00.000Z" }, { id: 3, fruit: 'cherry', createdOn: "2016-09-13T23:00:00.000Z", submittedDate: "2016-09-11T23:00:00.000Z" }, ] this.gridData = data; changeDateFormat(this.gridData); printContents(); function changeDateFormat(dataChanging) { for(let someData of dataChanging) { let year = someData.createdOn.slice(0,4); let month = someData.createdOn.slice(5,7); let day = someData.createdOn.slice(8,10); someData.createdOn = year + '/' + month + '/' + day; } } function printContents() { for(let someData of this.gridData) { console.log(someData.createdOn); } }