En este artículo vamos a ver qué es DatePipe en Angular 10 y cómo usarlo.
tubería de fecha
Sintaxis:
{{ value | date }}
Acercarse:
- Cree la aplicación angular que se utilizará.
- No es necesario realizar ninguna importación para utilizar DatePipe.
- En app.component.ts, defina la variable que toma el valor de la fecha.
- En app.component.html use la sintaxis anterior para crear un elemento de fecha.
- sirva la aplicación angular usando ng serve para ver el resultado.
Parámetros:
- formato: Toma un valor de string.
- zona horaria: toma un valor de string.
- locale: toma un valor de string.
Ejemplo 1:
app.component.ts
import { Component, OnInit }
from '@angular/core';
@Component({
selector: 'app-root',
templateUrl: './app.component.html'
})
export class AppComponent {
today: number = Date.now();
}
app.component.html
<p>Date {{today | date}}</p>
<p>Time {{today | date:'h:mm a z'}}</p>
Producción:
Ejemplo 2:
app.component.ts
import { Component } from '@angular/core';
@Component({
selector: 'app-root',
templateUrl: './app.component.html'
})
export class AppComponent {
today: number = Date.now();
}
app.component.html
<p>Date {{today | date}}</p>
<p>Time {{today | date:'h:m:s'}}</p>
Producción:
