cargdev/angular
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(datePipe): support narrow forms for month and weekdays (#12297)

Browse Source 
Closes #12294
This commit is contained in:
Andrei Tserakhau 2016-10-19 20:05:13 +03:00 committed by Alex Rickabaugh
parent 97bc97153b
commit f77ab6a2d2
3 changed files with 34 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
modules/@angular/common/src/pipes/date_pipe.ts
View File

@ -33,21 +33,21 @@ import {InvalidPipeArgumentError} from './invalid_pipe_argument_error';
* - `'shortTime'`: equivalent to `'jm'` (e.g. `12:05 PM` for `en-US`) * - `'shortTime'`: equivalent to `'jm'` (e.g. `12:05 PM` for `en-US`)
* *
* *
* | Component | Symbol | Short Form | Long Form | Numeric | 2-digit | * | Component | Symbol | Narrow | Short Form | Long Form | Numeric | 2-digit |
* |-----------|:------:|--------------|-------------------|-----------|-----------| * |-----------|:------:|--------|--------------|-------------------|-----------|-----------|
* | era | G | G (AD) | GGGG (Anno Domini)| - | - | * | era | G | G (A) | GGG (AD) | GGGG (Anno Domini)| - | - |
* | year | y | - | - | y (2015) | yy (15) | * | year | y | - | - | - | y (2015) | yy (15) |
* | month | M | MMM (Sep) | MMMM (September) | M (9) | MM (09) | * | month | M | L (S) | MMM (Sep) | MMMM (September) | M (9) | MM (09) |
* | day | d | - | - | d (3) | dd (03) | * | day | d | - | - | - | d (3) | dd (03) |
* | weekday | E | EEE (Sun) | EEEE (Sunday) | - | - | * | weekday | E | E (S) | EEE (Sun) | EEEE (Sunday) | - | - |
* | hour | j | - | - | j (13) | jj (13) | * | hour | j | - | - | - | j (13) | jj (13) |
* | hour12 | h | - | - | h (1 PM) | hh (01 PM)| * | hour12 | h | - | - | - | h (1 PM) | hh (01 PM)|
* | hour24 | H | - | - | H (13) | HH (13) | * | hour24 | H | - | - | - | H (13) | HH (13) |
* | minute | m | - | - | m (5) | mm (05) | * | minute | m | - | - | - | m (5) | mm (05) |
* | second | s | - | - | s (9) | ss (09) | * | second | s | - | - | - | s (9) | ss (09) |
* | timezone | z | - | z (Pacific Standard Time)| - | - | * | timezone | z | - | - | z (Pacific Standard Time)| - | - |
* | timezone | Z | Z (GMT-8:00) | - | - | - | * | timezone | Z | - | Z (GMT-8:00) | - | - | - |
* | timezone | a | a (PM) | - | - | - | * | timezone | a | - | a (PM) | - | - | - |
* *
* In javascript, only the components specified will be respected (not the ordering, * In javascript, only the components specified will be respected (not the ordering,
* punctuations, ...) and details of the formatting will be dependent on the locale. * punctuations, ...) and details of the formatting will be dependent on the locale.

13
modules/@angular/common/test/pipes/date_pipe_spec.ts
View File

@ -59,7 +59,7 @@ export function main() {
expect(pipe.transform(date, 'MMM')).toEqual('Jun'); expect(pipe.transform(date, 'MMM')).toEqual('Jun');
expect(pipe.transform(date, 'MMMM')).toEqual('June'); expect(pipe.transform(date, 'MMMM')).toEqual('June');
expect(pipe.transform(date, 'd')).toEqual('15'); expect(pipe.transform(date, 'd')).toEqual('15');
expect(pipe.transform(date, 'E')).toEqual('Mon'); expect(pipe.transform(date, 'EEE')).toEqual('Mon');
expect(pipe.transform(date, 'EEEE')).toEqual('Monday'); expect(pipe.transform(date, 'EEEE')).toEqual('Monday');
if (!browserDetection.isOldChrome) { if (!browserDetection.isOldChrome) {
expect(pipe.transform(date, 'h')).toEqual('9'); expect(pipe.transform(date, 'h')).toEqual('9');
@ -72,6 +72,9 @@ export function main() {
if (!browserDetection.isOldChrome) { if (!browserDetection.isOldChrome) {
expect(pipe.transform(date, 'HH')).toEqual('09'); expect(pipe.transform(date, 'HH')).toEqual('09');
} }
expect(pipe.transform(date, 'E')).toEqual('M');
expect(pipe.transform(date, 'L')).toEqual('J');
expect(pipe.transform(date, 'm')).toEqual('3'); expect(pipe.transform(date, 'm')).toEqual('3');
expect(pipe.transform(date, 's')).toEqual('1'); expect(pipe.transform(date, 's')).toEqual('1');
expect(pipe.transform(date, 'mm')).toEqual('03'); expect(pipe.transform(date, 'mm')).toEqual('03');
@ -81,13 +84,13 @@ 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, 'EEE, M/d/y')).toEqual('Mon, 6/15/2015');
expect(pipe.transform(date, 'E, M/d')).toEqual('Mon, 6/15'); expect(pipe.transform(date, 'EEE, M/d')).toEqual('Mon, 6/15');
expect(pipe.transform(date, 'MMM d')).toEqual('Jun 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, 'dd/MM/yyyy')).toEqual('15/06/2015');
expect(pipe.transform(date, 'MM/dd/yyyy')).toEqual('06/15/2015'); expect(pipe.transform(date, 'MM/dd/yyyy')).toEqual('06/15/2015');
expect(pipe.transform(date, 'yMEd')).toEqual('20156Mon15'); expect(pipe.transform(date, 'yMEEEd')).toEqual('20156Mon15');
expect(pipe.transform(date, 'MEd')).toEqual('6Mon15'); expect(pipe.transform(date, 'MEEEd')).toEqual('6Mon15');
expect(pipe.transform(date, 'MMMd')).toEqual('Jun15'); expect(pipe.transform(date, 'MMMd')).toEqual('Jun15');
expect(pipe.transform(date, 'yMMMMEEEEd')).toEqual('Monday, June 15, 2015'); expect(pipe.transform(date, 'yMMMMEEEEd')).toEqual('Monday, June 15, 2015');
// IE and Edge can't format a date to minutes and seconds without hours // IE and Edge can't format a date to minutes and seconds without hours

15
modules/@angular/facade/src/intl.ts
View File

@ -77,6 +77,7 @@ var DATE_FORMATS = {
MM: datePartGetterFactory(digitCondition('month', 2)), MM: datePartGetterFactory(digitCondition('month', 2)),
M: datePartGetterFactory(digitCondition('month', 1)), M: datePartGetterFactory(digitCondition('month', 1)),
LLLL: datePartGetterFactory(nameCondition('month', 4)), LLLL: datePartGetterFactory(nameCondition('month', 4)),
L: datePartGetterFactory(nameCondition('month', 1)),
dd: datePartGetterFactory(digitCondition('day', 2)), dd: datePartGetterFactory(digitCondition('day', 2)),
d: datePartGetterFactory(digitCondition('day', 1)), d: datePartGetterFactory(digitCondition('day', 1)),
HH: digitModifier( HH: digitModifier(
@ -161,13 +162,19 @@ function hour12Modify(
} }
function digitCondition(prop: string, len: number): Intl.DateTimeFormatOptions { function digitCondition(prop: string, len: number): Intl.DateTimeFormatOptions {
var result: {[k: string]: string} = {}; const result: {[k: string]: string} = {};
result[prop] = len == 2 ? '2-digit' : 'numeric'; result[prop] = len === 2 ? '2-digit' : 'numeric';
return result; return result;
} }
function nameCondition(prop: string, len: number): Intl.DateTimeFormatOptions { function nameCondition(prop: string, len: number): Intl.DateTimeFormatOptions {
var result: {[k: string]: string} = {}; const result: {[k: string]: string} = {};
result[prop] = len < 4 ? 'short' : 'long'; if (len < 4) {
result[prop] = len > 1 ? 'short' : 'narrow';
} else {
result[prop] = 'long';
}
return result; return result;
} }