es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

IsoDateTimeConverter no produce el formato correcto, y el cliente Angular arroja un error cuando el día es superior a 12 en “dd.MM.yyyy”.

Me encontré con este problema de formato de fecha hace algún tiempo, pero aún no entiendo por qué es.

Es un proyecto ASP.NET Core 2.2 y Angular 7. En la clase Product, defino esta propiedad

using Newton.Json;

public class Product 
{
    ...
    [JsonConverter(typeof(DateFormatConverter), "dd/MM/yyyy")]
    public DateTime CreationDate { get; set; }
}

La clase del convertidor está definida con la librería NewtonSoft JSON.NET:

public class DateFormatConverter : IsoDateTimeConverter
{
    public DateFormatConverter()
    {
        DateTimeFormat = "dd/MM/yyyy";//@"dd/MM/yyyy";
    }

    public DateFormatConverter(string format)
    {
        DateTimeFormat = format;
    }
}

Necesito mostrar esta fecha en ese formato en el cliente de Angular. Cuando muestro la fecha “05.08.2021”, funciona bien, pero cuando el día es mayor a “12”, por ejemplo “14.08.2021”, se produce un error. Parece que el formato interpreta “dd” como mes, y no como días, ya que el error puede comenzar a partir del día trece como número de día.

Error mostrado en la consola del navegador Chrome:

InvalidPipeArgument: ‘No se puede convertir “14.08.2021” en una fecha’ para la tubería ‘DatePipe’

en invalidPipeArgumentError (common.js:4140)
en DatePipe.push../node_modules/@angular/common/fesm5/common.js.DatePipe.transform (common.js:5067)…

Así que solo necesito descomentar este atributo JsonConverter para que funcione sin este error:

//[JsonConverter(typeof(DateFormatConverter), "dd/MM/yyyy")]
public DateTime CreationDate {get;set;}

La clase de Angular es:

export class Product {
creationDate: string;...

La fecha del producto se muestra en el componente de Angular de la siguiente manera:

 {{product.creationDate | date:'dd/MM/yyyy/'}}

Como puedes ver en el mensaje de error del navegador, la fecha tampoco coincide
con el formato definido por Json DateConverter.

Sin usar este formateador en el servidor, los objetos JSON (dto) contienen
una cadena de fecha como esta: creationDate:"2021-08-05T00:00:00".

En la tabla de la base de datos de SQL Server, la fecha se guarda en este formato:

2021-08-05 00:00:00.0000000

¿Cuál es la razón de esto, por qué este extenso NewtonSoft Json.NET IsoDateTimeConverter no funciona? ¿Por qué produce el formato dividido por puntos?

Tags:  , , , ,

Answer

  1. Avatar for davy.ai

    Parece que el problema está con el formato de fecha utilizado en el Angular DatePipe. El formato especificado en el pipe debe coincidir con el formato especificado en la clase DateFormatConverter. En el código actual, el formato en el pipe se especifica como ‘dd/MM/yyyy/’, que incluye una barra adicional ‘/’.

    Además, parece que el formato de fecha utilizado en la tabla de la base de datos SQL Server es diferente al formato especificado en la clase DateFormatConverter. Esto podría ser la razón por la cual la clase convertidora no está funcionando como se esperaba.

    Para resolver el problema, podrías intentar los siguientes pasos:

    1. Asegúrate de que el formato de fecha especificado en la clase DateFormatConverter coincida con el formato de fecha utilizado en la tabla de la base de datos SQL Server.
    2. Actualiza el formato del Angular DatePipe para que coincida con el formato especificado en la clase DateFormatConverter.

    Por ejemplo, si el formato en la clase DateFormatConverter es ‘dd/MM/yyyy’, el formato del DatePipe debería ser ‘dd/MM/yyyy’.

    1. Si el problema persiste, puedes intentar remover el atributo JsonConverter de la clase Product y convertir manualmente la fecha al formato deseado en el componente Angular utilizando una función o biblioteca personalizada.

Comments are closed.