)
estou usando Angular 15 biblioteca ng -bootstrap .
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
estou usando Angular 15 biblioteca ng -bootstrap .
Olá Moacyr, tudo bem com você?
Peço desculpas pela demora em obter um retorno.
Para converter a data no formato ano-mes-dia para dia-mes-ano em Angular, você pode usar a classe DatePipe fornecida pelo próprio Angular. A classe DatePipe permite formatar uma data em vários formatos de data e hora.
Para isso, no arquivo base do projeto, o arquivo app.module.ts, adicione as seguintes importações:
import { DatePipe } from '@angular/common';
import { registerLocaleData } from '@angular/common';
import localeBr from '@angular/common/locales/pt';
import { LOCALE_ID } from '@angular/core';
registerLocaleData(localeBr, 'pt')Após isso, no mesmo arquivo, na configuração de providers, que é responsável por fornecer dependências que serão usadas por toda a aplicação, importe o módulo DatePipe:
providers: [DatePipe, { provide: LOCALE_ID, useValue: 'pt' }],Para utilizá-lo, caso queira utilizar uma função de conversão em seu componente, utilize a opção transform para modificar a data:
import { DatePipe } from '@angular/common';
export class DataComponent {
formattedDate: string | null = null;
constructor(private datePipe: DatePipe){
const currentDate = new Date();
console.log("Data atual = " + currentDate)
this.formattedDate = this.datePipe.transform(currentDate, 'dd/MM/yyyy');
console.log("Data Formatada: " + this.formattedDate);
}
}Resultado:
Data atual = Thu May 11 2023 18:50:26 GMT-0300 (Horário Padrão de Brasília)
Data Formatada: 11/05/2023De posse da configuração, você pode utilizar a data formatada em seu template. Ou, caso queira mudar apenas a visualização para o usuário, basta utilizar os pipes de formatação dentro do próprio arquivo html, por exemplo: {{formattedDate | date : 'short' : '' : 'pt-BR'}}.
Deixo como recomendação, um artigo caso queira se aprofundar no assunto de formatação de datas usando o DatePipe e também, a documentação da ferramenta:
Espero ter ajudado. Continue mergulhando em conhecimento e não hesite em voltar ao fórum para continuar aprendendo e interagindo com a comunidade.
Em caso de dúvidas estou à disposição.
Abraços e bons estudos!