feat(common/datePipe): change date formatter to use correct pattern closes #7008 (#8154)

- add regular expression to parse date parts
- add date part creator function
- replace tokens in pattern to parsed parts
This commit is contained in:
Andrei Tserakhau 2016-05-26 22:06:29 +03:00 committed by Miško Hevery
parent be48ba1b06
commit 324f0147f6
2 changed files with 177 additions and 64 deletions

View File

@ -61,17 +61,25 @@ export function main() {
}); });
it('should format common multi component patterns', () => { it('should format common multi component patterns', () => {
expect(pipe.transform(date, 'E, M/d/y')).toEqual('Mon, 6/15/2015');
expect(pipe.transform(date, 'E, M/d')).toEqual('Mon, 6/15');
expect(pipe.transform(date, 'MMM d')).toEqual('Jun 15');
expect(pipe.transform(date, 'dd/MM/yyyy')).toEqual('15/06/2015');
expect(pipe.transform(date, 'MM/dd/yyyy')).toEqual('06/15/2015');
expect(pipe.transform(date, 'yMEd')).toEqual('Mon, 6/15/2015'); expect(pipe.transform(date, 'yMEd')).toEqual('Mon, 6/15/2015');
expect(pipe.transform(date, 'MEd')).toEqual('Mon, 6/15'); expect(pipe.transform(date, 'MEd')).toEqual('Mon, 6/15');
expect(pipe.transform(date, 'MMMd')).toEqual('Jun 15'); expect(pipe.transform(date, 'MMMd')).toEqual('Jun 15');
expect(pipe.transform(date, 'yMMMMEEEEd')).toEqual('Monday, June 15, 2015'); expect(pipe.transform(date, 'yMMMMEEEEd')).toEqual('Monday, June 15, 2015');
expect(pipe.transform(date, 'jms')).toEqual('9:43:11 PM'); expect(pipe.transform(date, 'jms')).toEqual('9:43:11 PM');
expect(pipe.transform(date, 'ms')).toEqual('43:11'); expect(pipe.transform(date, 'ms')).toEqual('43:11');
expect(pipe.transform(date, 'jm')).toEqual('9:43');
}); });
it('should format with pattern aliases', () => { it('should format with pattern aliases', () => {
expect(pipe.transform(date, 'medium')).toEqual('Jun 15, 2015, 9:43:11 PM'); expect(pipe.transform(date, 'medium')).toEqual('Jun 15, 2015, 9:43:11 PM');
expect(pipe.transform(date, 'short')).toEqual('6/15/2015, 9:43 PM'); expect(pipe.transform(date, 'short')).toEqual('6/15/2015, 9:43 PM');
expect(pipe.transform(date, 'dd/MM/yyyy')).toEqual('15/06/2015');
expect(pipe.transform(date, 'MM/dd/yyyy')).toEqual('06/15/2015');
expect(pipe.transform(date, 'fullDate')).toEqual('Monday, June 15, 2015'); expect(pipe.transform(date, 'fullDate')).toEqual('Monday, June 15, 2015');
expect(pipe.transform(date, 'longDate')).toEqual('June 15, 2015'); expect(pipe.transform(date, 'longDate')).toEqual('June 15, 2015');
expect(pipe.transform(date, 'mediumDate')).toEqual('Jun 15, 2015'); expect(pipe.transform(date, 'mediumDate')).toEqual('Jun 15, 2015');

View File

@ -70,78 +70,183 @@ export class NumberFormatter {
return new Intl.NumberFormat(locale, intlOptions).format(num); return new Intl.NumberFormat(locale, intlOptions).format(num);
} }
} }
var DATE_FORMATS_SPLIT =
/((?:[^yMLdHhmsaZEwGjJ']+)|(?:'(?:[^']|'')*')|(?:E+|y+|M+|L+|d+|H+|h+|J+|j+|m+|s+|a|Z|G+|w+))(.*)/;
function digitCondition(len: number): string { var PATTERN_ALIASES = {
return len == 2 ? '2-digit' : 'numeric'; yMMMdjms: datePartGetterFactory(combine([
} digitCondition('year', 1),
function nameCondition(len: number): string { nameCondition('month', 3),
return len < 4 ? 'short' : 'long'; digitCondition('day', 1),
} digitCondition('hour', 1),
function extractComponents(pattern: string): Intl.DateTimeFormatOptions { digitCondition('minute', 1),
var ret: Intl.DateTimeFormatOptions = {}; digitCondition('second', 1),
var i = 0, j; ])),
while (i < pattern.length) { yMdjm: datePartGetterFactory(combine([
j = i; digitCondition('year', 1),
while (j < pattern.length && pattern[j] == pattern[i]) j++; digitCondition('month', 1),
let len = j - i; digitCondition('day', 1),
switch (pattern[i]) { digitCondition('hour', 1),
case 'G': digitCondition('minute', 1)
ret.era = nameCondition(len); ])),
break; yMMMMEEEEd: datePartGetterFactory(combine([
case 'y': digitCondition('year', 1),
ret.year = digitCondition(len); nameCondition('month', 4),
break; nameCondition('weekday', 4),
case 'M': digitCondition('day', 1)
if (len >= 3) ])),
ret.month = nameCondition(len); yMMMMd: datePartGetterFactory(
else combine([digitCondition('year', 1), nameCondition('month', 4), digitCondition('day', 1)])),
ret.month = digitCondition(len); yMMMd: datePartGetterFactory(
break; combine([digitCondition('year', 1), nameCondition('month', 3), digitCondition('day', 1)])),
case 'd': yMd: datePartGetterFactory(
ret.day = digitCondition(len); combine([digitCondition('year', 1), digitCondition('month', 1), digitCondition('day', 1)])),
break; jms: datePartGetterFactory(combine(
case 'E': [digitCondition('hour', 1), digitCondition('second', 1), digitCondition('minute', 1)])),
ret.weekday = nameCondition(len); jm: datePartGetterFactory(combine([digitCondition('hour', 1), digitCondition('minute', 1)]))
break; };
case 'j':
ret.hour = digitCondition(len); var DATE_FORMATS = {
break; yyyy: datePartGetterFactory(digitCondition('year', 4)),
case 'h': yy: datePartGetterFactory(digitCondition('year', 2)),
ret.hour = digitCondition(len); y: datePartGetterFactory(digitCondition('year', 1)),
ret.hour12 = true; MMMM: datePartGetterFactory(nameCondition('month', 4)),
break; MMM: datePartGetterFactory(nameCondition('month', 3)),
case 'H': MM: datePartGetterFactory(digitCondition('month', 2)),
ret.hour = digitCondition(len); M: datePartGetterFactory(digitCondition('month', 1)),
ret.hour12 = false; LLLL: datePartGetterFactory(nameCondition('month', 4)),
break; dd: datePartGetterFactory(digitCondition('day', 2)),
case 'm': d: datePartGetterFactory(digitCondition('day', 1)),
ret.minute = digitCondition(len); HH: hourExtracter(datePartGetterFactory(hour12Modify(digitCondition('hour', 2), false))),
break; H: hourExtracter(datePartGetterFactory(hour12Modify(digitCondition('hour', 1), false))),
case 's': hh: hourExtracter(datePartGetterFactory(hour12Modify(digitCondition('hour', 2), true))),
ret.second = digitCondition(len); h: hourExtracter(datePartGetterFactory(hour12Modify(digitCondition('hour', 1), true))),
break; jj: datePartGetterFactory(digitCondition('hour', 2)),
case 'z': j: datePartGetterFactory(digitCondition('hour', 1)),
ret.timeZoneName = 'long'; mm: datePartGetterFactory(digitCondition('minute', 2)),
break; m: datePartGetterFactory(digitCondition('minute', 1)),
case 'Z': ss: datePartGetterFactory(digitCondition('second', 2)),
ret.timeZoneName = 'short'; s: datePartGetterFactory(digitCondition('second', 1)),
break; // while ISO 8601 requires fractions to be prefixed with `.` or `,`
} // we can be just safely rely on using `sss` since we currently don't support single or two digit
i = j; // fractions
} sss: datePartGetterFactory(digitCondition('second', 3)),
return ret; EEEE: datePartGetterFactory(nameCondition('weekday', 4)),
EEE: datePartGetterFactory(nameCondition('weekday', 3)),
EE: datePartGetterFactory(nameCondition('weekday', 2)),
E: datePartGetterFactory(nameCondition('weekday', 1)),
a: hourClockExtracter(datePartGetterFactory(hour12Modify(digitCondition('hour', 1), true))),
Z: datePartGetterFactory({timeZoneName: 'long'}),
z: datePartGetterFactory({timeZoneName: 'short'}),
ww: datePartGetterFactory({}), // Week of year, padded (00-53). Week 01 is the week with the
// first Thursday of the year. not support ?
w: datePartGetterFactory({}), // Week of year (0-53). Week 1 is the week with the first Thursday
// of the year not support ?
G: datePartGetterFactory(nameCondition('era', 1)),
GG: datePartGetterFactory(nameCondition('era', 2)),
GGG: datePartGetterFactory(nameCondition('era', 3)),
GGGG: datePartGetterFactory(nameCondition('era', 4))
};
function hourClockExtracter(inner: (date: Date, locale: string) => string): (
date: Date, locale: string) => string {
return function(date: Date, locale: string): string {
var result = inner(date, locale);
return result.split(' ')[1];
};
} }
var dateFormatterCache: Map<string, Intl.DateTimeFormat> = new Map<string, Intl.DateTimeFormat>(); function hourExtracter(inner: (date: Date, locale: string) => string): (date: Date,
locale: string) => string {
return function(date: Date, locale: string): string {
var result = inner(date, locale);
return result.split(' ')[0];
};
}
function hour12Modify(options: Intl.DateTimeFormatOptions,
value: boolean): Intl.DateTimeFormatOptions {
options.hour12 = value;
return options;
}
function digitCondition(prop: string, len: number): Intl.DateTimeFormatOptions {
var result = {};
result[prop] = len == 2 ? '2-digit' : 'numeric';
return result;
}
function nameCondition(prop: string, len: number): Intl.DateTimeFormatOptions {
var result = {};
result[prop] = len < 4 ? 'short' : 'long';
return result;
}
function combine(options: Intl.DateTimeFormatOptions[]): Intl.DateTimeFormatOptions {
var result = {};
options.forEach(option => { (<any>Object).assign(result, option); });
return result;
}
function datePartGetterFactory(ret: Intl.DateTimeFormatOptions): (date: Date, locale: string) =>
string {
return function(date: Date, locale: string): string {
return new Intl.DateTimeFormat(locale, ret).format(date);
};
}
var datePartsFormatterCache: Map<string, string[]> = new Map<string, string[]>();
function dateFormatter(format: string, date: Date, locale: string): string {
var text = '';
var match;
var fn;
var parts: string[] = [];
if (PATTERN_ALIASES[format]) {
return PATTERN_ALIASES[format](date, locale);
}
if (datePartsFormatterCache.has(format)) {
parts = datePartsFormatterCache.get(format);
} else {
var matchs = DATE_FORMATS_SPLIT.exec(format);
while (format) {
match = DATE_FORMATS_SPLIT.exec(format);
if (match) {
parts = concat(parts, match, 1);
format = parts.pop();
} else {
parts.push(format);
format = null;
}
}
datePartsFormatterCache.set(format, parts);
}
parts.forEach(part => {
fn = DATE_FORMATS[part];
text += fn ? fn(date, locale) :
part === "''" ? "'" : part.replace(/(^'|'$)/g, '').replace(/''/g, "'");
});
return text;
}
var slice = [].slice;
function concat(array1, array2, index): string[] {
return array1.concat(slice.call(array2, index));
}
export class DateFormatter { export class DateFormatter {
static format(date: Date, locale: string, pattern: string): string { static format(date: Date, locale: string, pattern: string): string {
var key = locale + pattern; return dateFormatter(pattern, date, locale);
if (dateFormatterCache.has(key)) {
return dateFormatterCache.get(key).format(date);
}
var formatter = new Intl.DateTimeFormat(locale, extractComponents(pattern));
dateFormatterCache.set(key, formatter);
return formatter.format(date);
} }
} }