2

I am parsing a csv file which has a date column in dd/mm/yyyy format. The format of the date needs to be transformed to yyyy-mm-dd before saving it to the database. So I am using datepipe.transform method for this as below

this.datePipe.transform(x[this.csvcolumns.colDOB], 'yyyy-MM-dd','de')

By default the datepipe only accepts US date format which is mm/dd/yyyy. So for a date like 18/02/2000,the datepipe throws an error as below.

InvalidPipeArgument: 'Unable to convert "13/02/2012" into a date' for pipe 'DatePipe'

I've added the following configuration in app.module.ts.

import { registerLocaleData } from '@angular/common'; 
import localeDe from '@angular/common/locales/de';
registerLocaleData(localeDe);

So what is the best way to add LocaleId in DatePipe.transform as below

(method) DatePipe.transform(value: any, format?: string, timezone?: string, locale?: string): string

Do i need to make any changes in the constructor for that? My constructor looks like below

 providers: [DatePipe] })
 
 export class BulkuploadPage implements OnInit {
    constructor(private datePipe: DatePipe) { } 
  ngOnInit() {}
Zze
  • 18,229
  • 13
  • 85
  • 118
Anupriya
  • 23
  • 1
  • 5
  • see the docs here: https://angular.io/api/common/formatDate the date pipe is used to transform a Date object, a number, or an ISO Date string into your date format of choice. It needs to be one of those 3 things for you to use it. if it is not one of those 3 things, you need to convert it first or use a different method. – bryan60 Mar 06 '22 at 20:26
  • @bryan60 Thanks for the suggestion. Isn't the formatDate() method still require date in yyyy/mm/dd format as parameter? Then basically I have to change '18-02-2000' into '2000-02-18' which is originally my requirement. Or is there a way to pass 'dd-mm-yyyy' as parameter to formatDate() method? – Anupriya Mar 08 '22 at 13:36
  • `formatDate` is what the date pipe uses under the hood. it only accepts one of 3 things, a Date object, a number, or an ISO time string, and converts that into a date string of your choice. since your input is not one of those things, and you actually want to convert it to an ISO string, the date pipe and `formatDate` are not the option for you here. Unless you want to manually convert it into a date object, and use the pipe / function to create an ISO string. – bryan60 Mar 08 '22 at 16:10

1 Answers1

1

Personally, I think that using the datePipe transform outside of a custom datePipe is a bit of an anti-pattern.

This is the way I would do it using moment:

myFormattedDate = moment('13/02/2000', 'DD/MM/YYYY').format('YYYY-MM-DD');
//where..
myFormattedDate = moment(yourDate, currentFormat).format(desiredFormat);

and then you can use

<p>{{ someDate | date: 'YYYY-MM-dd' }}</p>

noting that you may not need to use the format section of the pipe depending on if you changed your default.

Working example: https://stackblitz.com/edit/angular-ps68n4?file=src%2Fapp%2Fapp.component.ts

Zze
  • 18,229
  • 13
  • 85
  • 118
  • Thanks for the reply and sorry as my earlier description was a bit confusing. In my case, I am just trying to parse the csv file and directy saving it to datebase. I dont have to display the date (in dd.mm.yyyy) in a webpage. So the whole coding whatever i need to do happens in .ts file. If that's the case is there a better way to acheive it without using momentum? – Anupriya Mar 06 '22 at 20:16