Fechas con pipes en Angular

Para presentar este nuevo blog me he decidido a publicar algo sencillo pero que me ha sido de bastante ayuda. No pocas veces en el desarrollo de un programa es necesario trabajar con fechas y en la gran mayoría de los casos me he visto metido en un grave problema al tratar de conciliar el formato de la base de datos con el del front. Es así pues que me encontré enfrascado en este dilema con mongoDB y Angular. 

La gran solución: datePipe.

Su aplicación para las fechas es sumamente sencilla. Solo es necesario agregar la siguiente línea: 

y la fecha se convertirá automáticamente al formato que queremos. 

TwoWayBinding con fechas en un input de tipo date.

Si quieres hacer el binding y que tus datos se actualicen será necesario este pequeño hack en el input del cual quieres formatear la fecha. 

Como podrás notar. Es necesario un (ngModelChange) para detectar los cambios y pasar las modificaciones del datePicker de html a tu variable miFecha. Nótese la variable $event la cual contiene la fecha seleccionada y ejecuta el cambio para que el binding se realice de manera correcta. 

Los santos ejemplos de la vida. 

Aprovechando la tecnología de stackblitz he creado un proyecto muy sencillo donde expongo las bondades de trabajar de esta manera, algunos ejemplos de lo fácil que es formatear la salida sin tocar para nada la variable miFecha y como es posible hacer el binding en un input de manera nativa (con el hack). 

Para los amantes de los tecnicismos esta es la documentación completa de angular y ésta es la sección que trata sobre DatePipe. Si quieres adelantar un poco a mi próximo post puedes leerte esto sobre los pipes. 

Bendiciones y aclaraciones.