Haz tu profesión a prueba de IA

Antes:$249

Currency
$209
Suscríbete

Termina en:

00h

51m

50s

3

Formatos de fecha con DatePipe

Usando DatePipe podemos dar formatos a nuestras fechas como vimos en la clase 48 “Parametros en Pipe”

Adicionalmente a las mostradas en el curso dejo todas las soportadas segun la documentacion oficial

{{lugar.id |date:"short" }}// que nos retorna la fecha en formato  'M/d/yy, h:mm a' || (6/15/15, 9:03 AM)

{{lugar.id |date:"medium" }}// que nos retorna la fecha en formato 'MMM d, y, h:mm:ss a' (Jun 15, 2015, 9:03:01 AM)

{{lugar.id |date:"long" }}// que nos retorna la fecha en formato 'MMMM d, y, h:mm:ss a z' ( June 15, 2015 at 9:03:01 AM GMT+1)

{{lugar.id |date:"full" }}// que nos retorna la fecha en formato  'EEEE, MMMM d, y, h:mm:ss a zzzz' (e Monday, June 15, 2015 at 9:03:01 AM GMT+01:00)

{{lugar.id |date:"shortDate" }}// que nos retorna la fecha en formato 'M/d/yy' (6/15/15)

{{lugar.id |date:"mediumDate" }}// que nos retorna la fecha en formato 'MMM d, y' (Jun 15, 2015)

{{lugar.id |date:"longDate" }}// que nos retorna la fecha en formato  'MMMM d, y' (June 15, 2015)

{{lugar.id |date:"fullDate" }}// que nos retorna la fecha en formato  'EEEE, MMMM d, y' (Monday, June 15, 2015)

{{lugar.id |date:"shortTime" }}// que nos retorna la fecha  en formato  'h:mm a' (9:03 AM)

{{lugar.id |date:"shortTime" }}// que nos retorna la fecha  en formato  'h:mm a' (9:03 AM)

{{lugar.id |date:"mediumTime" }}// que nos retorna la fecha  en formato 'h:mm:ss a' ( 9:03:01 AM)

{{lugar.id |date:"longTime" }}// que nos retorna la fecha  en formato 'h:mm:ss a z' (9:03:01 AM GMT+1)

{{lugar.id |date:"fullTime" }}// que nos retorna la fecha  en formato 'h:mm:ss a zzzz' (9:03:01 AM GMT+01:00)

Y por ultimo adicionalmente a estos podemos crear nuestro propio formato de fecha pasandole como parametro el formato deseado.
por ejemplo:

{{lugar.id |date:"dd-MM-yyyy" }} // que nos retorna la fecha en formato 'dd-mm-yyy' (29-01-2017)

Espero les sea de ayuda
Saludos

Escribe tu comentario
+ 2
Ordenar por:
5
9Puntos
6 años

Si uso fullDate me pone el los días en ingles, como lo convierto a español?, sería útil esa información en tu post. Gracias

2

Como podria lograr un pipe o algun metodo para colocar la fecha diciendo " hace x minutos" de acuerdo hace cuanto tiempo se registro la acción?

1
596Puntos
6 años

Escapas los strings así:

{{ fecha | date:'\'hace\' mm \'minutos\''}}
1
4662Puntos
3 años
... //otros import que use tu móduloimport {LOCALE_ID } from '@angular/core';import localeEs from '@angular/common/locales/es';import { registerLocaleData } from '@angular/common';
registerLocaleData(localeEs, 'es'); //Esto no es un import, pero va justo despues de ellos!
@NgModule({
  imports: [...], // Los que use tu appdeclarations: [...], // Los que use tu appproviders: [..., // Los que use tu app
    {provide: LOCALE_ID, useValue: 'es'} // Añades esta línea en los providers
  ],
  bootstrap: [ AppComponent ] // Lo que use tu app aquí
})
export class AppModule {}

Para cambiar el formato de fecha a español, fuente:

1
3 años

como puedo calcular los días transcuridos entre dos fechas, usando DatePipe