DatePipe transform shows wrong date format

Issue

I am using Angular version 12 and datePipe.transform, I am getting date in dd/MM/yyyy format in string and I want to bind that date in my reactive form ( to edit the form ) where I use Angular material date picker Basic Angular Date picker

Demo

I am sure I am doing something wrong but I don't know what? Can anyone help me?

SOLUTION For me:

MomentJS is the best solution for all date and time glitches!

If you are looking for alternative of moment then below is the link you must look into it. - Thanks to Jakub Kozak

https://medium.com/swlh/best-moment-js-alternatives-5dfa6861a1eb

Solution

Just change this:

    const CreatedDate1 = this.datePipe.transform(CreatedDate, 'long');

P.S: You were using the string '09/11/2021' instead your formatted variable 'CreatedDate'.

By the way, as a piece of advice, it's a good practice to use "CamelCase" for naming your variables and consts in Angular ('createdDate', in your example), and leave the "PascalCase" (as 'CreatedDate') for the Interface/Classes/... I left an article about it HERE See you!

Answered By - Juan Vicente Berzosa Tejero