Processing date in.ts file
The format of the date will have different display outputs in different methods.
dateTime: Date;
this.dataTime = new Date(); // Get the current date
// Output: Fri Dec 08 2017 00:33:01 GMT+0800 (China Standard Time)
Sometimes we need some string type output in other formats.
You can see all the tostring methods in all date s.
console.log('orderdate:', this.OrderDate);
console.log('toISOString:', this.OrderDate.toISOString());
console.log('toDateString:', this.OrderDate.toDateString());
console.log('toUTCString:', this.OrderDate.toUTCString());
console.log('toJSON:', this.OrderDate.toJSON());
console.log('toLocaleDateString:', this.OrderDate.toLocaleDateString());
console.log('toLocaleString:', this.OrderDate.toLocaleString());
console.log('toLocaleTimeString:', this.OrderDate.toLocaleTimeString());
console.log('toString:', this.OrderDate.toString());
console.log('toTimeString:', this.OrderDate.toTimeString());
// Output results:
// toISOString: 2017-12-07T16:33:01.843Z
// toDateString: Fri Dec 08 2017
// toUTCString: Thu, 07 Dec 2017 16:33:01 GMT
// toJSON: 2017-12-07T16:33:01.843Z
// toLocaleDateString: 2017/12/8
// ToLocaleString: 12:33:01 AM, 2017/12/8
// toLocaleTimeString:12:33:01 a.m.
// toString: Fri Dec 08 2017 00:33:01 GMT+0800 (China Standard Time)
// toTimeString: 00:33:01 GMT+0800 (China Standard Time)
Many times, the style you want to store in your database is:'yyyy-MM-dd HH:mm:ss', but the output above is not.
Note: The toISOString() method and toJSON() method outputs have the same style but different time zones
So, can the date pipe used in the foreground display be used?
constructor(
private datePipe: DatePipe,
) {}
dateChange(){
console.log('dateTime:', this.datePipe.transform(this.dateTime, 'yyyy-MM-dd HH:mm:ss'));
}
// Output: 2017-12-08 00:33:01
Tests show that the transform method in datePipe can be used to achieve the desired format, and the styles can be more diverse.
Usage of Date Foreground Display:
Reception html Page date formatting:
{{ dateTime | date:'yyyy-MM-dd HH:mm:ss'}}
{{ dateTime | date:'medium' }}
{{ dateTime | date:'short' }}
{{ dateTime | date:'fullDate' }}
{{ dateTime | date:'longDate' }}
{{ dateTime | date:'mediumDate' }}
{{ dateTime | date:'shortDate' }}
{{ dateTime | date:'mediumTime' }}
{{ dateTime | date:'shortTime' }}