Encontramos la respuesta a esta escollo, al menos eso pensamos. Si presentas dudas déjanoslo saber en un comentario, para nosotros será un gusto ayudarte
Solución:
Tuve un problema muy similar hace un tiempo: quería almacenar fechas locales en el lado del servidor (es decir, solo aaaa-mm-dd y sin información de tiempo/tiempo), pero dado que Angular Bootstrap Datepicker usa el objeto JavaScript Date esto no fue posible (se serializa a una fecha y hora UTC string en el JSON como usted mismo descubrió).
Resolví el problema con esta directiva: https://gist.github.com/weberste/354a3f0a9ea58e0ea0de
Esencialmente, estoy reformateando el valor cada vez que se selecciona una fecha en el selector de fecha (este valor, un formato aaaa-mm-dd stringse almacenará en el modelo) y cada vez que se acceda al modelo para completar la vista, necesito envolverlo en un objeto Date nuevamente para que datepicker lo maneje correctamente.
Solución encontrada aquí: https://github.com/angular-ui/bootstrap/issues/4837#issuecomment-203284205
El problema de la zona horaria está solucionado.
Puedes usar:
ng-model-options="timezone: 'utc'"
Para obtener un selector de fecha sin cálculo de zona horaria.
EDITAR: Esta solución no funciona desde la versión 2.x, sin embargo funcionó perfectamente bien hasta entonces. No pude encontrar una solución alternativa y todavía estoy usando la versión 1.3.3.
EDICIÓN 2: Como señaló Sébastien Deprez en los comentarios a continuación, esto se ha corregido en la versión 2.3.1. Lo acabo de probar y funciona muy bien.
Primero, me gustaría señalar que el selector de fecha localizado de Bootstrap es estúpido e inútil, nadie necesita algo como esto, todo lo que realmente quiere es una fecha aaaa-MM-dd, no veo ningún sentido en localizar una fecha cuando no No necesito tiempo.
No trato de doblar el lado del cliente para que se ajuste a la zona horaria del servidor, eso es excesivo y no funciona. En cambio, lo que hago es dejar que el usuario trabaje en su zona horaria y formatear la fecha antes de enviarla al servidor de esta manera:
fields.date = dateFilter(trans.date, 'MM/dd/yy');
Esto asegura que todo lo que el usuario ve en el selector de fechas lo recibo en el lado del servidor. Crucial si me preguntas. Si necesita establecer fechas mínimas y máximas, simplemente configúrelas en la zona horaria del usuario de esta manera:
$scope.datepickerOptions.minDate = new Date(dateFilter(minDate, 'yyyy-MM-dd'T'00:00:00', serverTimezone));
$scope.datepickerOptions.maxDate = new Date(dateFilter(maxDate, 'yyyy-MM-dd'T'00:00:00', serverTimezone));
minDate y maxDate son fechas localizadas en el servidor y serverTimezone es el desplazamiento de la zona horaria del servidor (“+0500”, por ejemplo).
¡Espero que esto ayude!
Recuerda compartir esta noticia si te valió la pena.