Vyhledávání na webu

javascript - Jak formátovat datum/čas v TypeScriptu?


Měl jsem nějaké potíže, když jsem se snažil získat objekt Date v TypeScriptu, aby se formátoval tak, jak chci.

Mám třídu Module, která je definována takto:

export class Module {

    constructor(public id: number, public name: string, public description: string, 
                 public lastUpdated: Date, public owner: string) { }

    getNiceLastUpdatedTime(): String {

        let options: Intl.DateTimeFormatOptions = {
            day: "numeric", month: "numeric", year: "numeric",
            hour: "2-digit", minute: "2-digit"
        };

        return this.lastUpdated.toLocaleDateString("en-GB", options) + " " + this.lastUpdated.toLocaleTimeString("en-GB", options);
    }
}

Když zavolám metodu s následujícím kódem:

    let date = new Date(1478708162000); // 09/11/2016 16:16pm (GMT)
    let module = new Module(1, "Test", "description", date, "test owner");
    console.log(module.getNiceLastUpdatedTime());

Nakonec skončím s následujícím vytištěným v konzoli:

'9 November 2016 16:16:02 GMT'

Co chci vidět, je:

09/11/2015 16:16

Podíval jsem se na dokumentaci na: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString a stále nemůžu přijít na to, co dělám špatně (vím, že je to dokumentace k JavaScript API, ale jsem si docela jistý, že to je to, co TypeScript používá pod kapotou).

Odpověď č. 1

Pokud chcete kromě data také čas, použijte Date.toLocaleString().

To bylo přímo z mé konzole:

> new Date().toLocaleString()
> "11/10/2016, 11:49:36 AM"

Pak můžete zadat místní řetězce a formátovací řetězec, abyste získali přesný výstup, který chcete.

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

Odpověď č. 2

Možnost 1: Momentjs:

Nainstalovat :

npm install moment --save

Import :

import * as moment from 'moment';

Použití :

let formattedDate = (moment(yourDate)).format('DD-MMM-YYYY HH:mm:ss')

Možnost 2: Použijte DatePipe, pokud používáte Angular:

Import :

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

Použití :

const datepipe: DatePipe = new DatePipe('en-US')
let formattedDate = datepipe.transform(yourDate, 'dd-MMM-YYYY HH:mm:ss')

Odpověď č. 3

Pro Angular byste měli jednoduše použít formatDate místo DatePipe.

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

constructor(@Inject(LOCALE_ID) private locale: string) { 
    this.dateString = formatDate(Date.now(),'yyyy-MM-dd',this.locale);
}

Odpověď č. 4

Použití API Temporal (2023)

Nové JavaScriptové datumové API je v návrhu fáze 3 (The Temporal API). Podívejte se na to, možná budete schopni vyřešit většinu svých problémů v blízké budoucnosti s jeho pomocí:

https://tc39.es/proposal-temporal/docs/index.html

Přestaňte používat momentjs - viz níže uvedené alternativy

Jak poznamenal @jonhF v komentářích, MomentJs doporučuje MomentJs už nepoužívat. Podívejte se na https://momentjs.com/docs/

Místo toho si uchovávám tento seznam se svými osobními TOP 3 knihovnami pro datum v JavaScriptu pro budoucí použití.

  • Date-fns - https://date-fns.org/
  • DayJS - https://day.js.org/
  • JS-Joda - https://js-joda.github.io/js-joda/

Starý komentář

(Už nepoužívejte knihovnu momentjs, je zastaralá!!!)

Navrhuji, abyste použili MomentJS

S momentem můžete mít mnoho výstupů a tento 09/11/2015 16:16 je jedním z nich.

Odpověď č. 5

V případě, že to potřebujete pro Angular, nejjednodušší přístup s minimem kódu je:

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

formatDate(Date.now(),'yyyy-MM-dd','en-US');

Odpověď č. 6

  1. Můžete vytvořit pipe děděnou z báze PipeTransform
  2. Pak implementujte metodu transformace

Použito v Angular 4 - funguje to. Nejlepší způsob, jak formátovat datum, je pomocí pipe.

Vytvořte si vlastní pipe takto:

import { Pipe, PipeTransform} from '@angular/core';
import { DatePipe } from '@angular/common';

@Pipe({
    name: 'dateFormat'
  })
  export class DateFormatPipe extends DatePipe implements PipeTransform {
    transform(value: any, args?: any): any {
       ///MMM/dd/yyyy 
       return super.transform(value, "MMM/dd/yyyy");
    }
  }

a používá se to v TypeScript třídě takto:

////my class////

export class MyComponent
{
  constructor(private _dateFormatPipe:DateFormatPipe)
  {
  }

  formatHereDate()
  {
     let myDate = this._dateFormatPipe.transform(new Date())//formatting current ///date here 
     //you can pass any date type variable 
  }
}

Odpověď č. 7

Zde je další možnost pro Angular (používající vlastní formátovací funkci) - tato je pro formát:

rrrr-mm-dd hh:nn:ss

-můžete upravit podle svých formátů, stačí přeuspořádat řádky a změnit oddělovače

dateAsYYYYMMDDHHNNSS(date): string {
  return date.getFullYear()
            + '-' + this.leftpad(date.getMonth() + 1, 2)
            + '-' + this.leftpad(date.getDate(), 2)
            + ' ' + this.leftpad(date.getHours(), 2)
            + ':' + this.leftpad(date.getMinutes(), 2)
            + ':' + this.leftpad(date.getSeconds(), 2);
}

leftpad(val, resultLength = 2, leftpadChar = '0'): string {
  return (String(leftpadChar).repeat(resultLength)
        + String(val)).slice(String(val).length);
}

Pro aktuální časovou značku použijte toto:

const curTime = this.dateAsYYYYMMDDHHNNSS(new Date());
console.log(curTime);

Bude výstup např.: 2018-12-31 23:00:01

Související články