Angular application has two different locale for debug and run

Question

I have an application with a calendar that posts a string representation of a timestamp. I pick a date, let's assume from a date picker (it's date-fns and angular-calendar).

I have a POST in my service

  postWorkingSlot(workingSlot: NewWorkingSlot, selectedOperativeID: number)
  {
    let util = new Util();
    workingSlot.starting_time = util.formatDateString(workingSlot.starting_time)
    workingSlot.ending_time = util.formatDateString(workingSlot.ending_time)
    const body = JSON.stringify(workingSlot);
    console.log('Timestamp added : ', body);
    return this.http.post((endpoint + "/" + "api/v1/professional/availability_slot/" + selectedOperativeID ), body, this.httpOptions);
  }

and this is a utility function I am using because I realised that formatDate() has some problems with 12/24h representation. The weird thing is that for the same date (lets assume the 2nd of July) when I run in debug mode I am getting : 2022-07-02T09:00:00.000+00:00 and when I run with ng serve I am getting 2022-02-07T09:00:00.000+00:00. You can see this happening in console in the following 2 images :

The failure you can see in the first image is 7th of the 15th month (which of course fails). I suspect a problem in the locale settings but what? What am I missing?

Thanks a lot for your time.

Answer 1

When you convert a date to string, it is using the locale to format it. If it is Greek it will be in the format dd/MM/yyyy but in us the format will be MM/dd/yyyy. So either pass the format when converting it to string as dd/Mm/yyyy or change the locale of your angular app. https://angular.io/guide/i18n-optional-manual-runtime-locale

Be carefull not to convert back from string to date. Always use ISO date in the format yyyy/MM/dd HH:mm:ss.

Use the ISO format when converting to string and sending it to the rest api. This will always work without changing the locale.