feat(common): add injection token for default date pipe format

In order to globally change the default format of the Angular date pipe, a new injection token called "DATE_PIPE_DEFAULT_FORMAT" is added and used in the date pipe

goldens/public-api/common/index.md

@@ -76,6 +76,9 @@ export class CurrencyPipe implements PipeTransform {
 // @public
 export const DATE_PIPE_DEFAULT_TIMEZONE: InjectionToken<string>;
 
+// @public
+export const DATE_PIPE_DEFAULT_FORMAT: InjectionToken<string>;
+
 // @public
 export class DatePipe implements PipeTransform {
     constructor(locale: string, defaultTimezone?: string | null | undefined);

packages/common/src/common.ts

@@ -22,7 +22,7 @@ export {parseCookieValue as ɵparseCookieValue} from './cookie';
 export {CommonModule} from './common_module';
 export {NgClass, NgForOf, NgForOfContext, NgIf, NgIfContext, NgPlural, NgPluralCase, NgStyle, NgSwitch, NgSwitchCase, NgSwitchDefault, NgTemplateOutlet, NgComponentOutlet} from './directives/index';
 export {DOCUMENT} from './dom_tokens';
-export {AsyncPipe, DatePipe, DATE_PIPE_DEFAULT_TIMEZONE, I18nPluralPipe, I18nSelectPipe, JsonPipe, LowerCasePipe, CurrencyPipe, DecimalPipe, PercentPipe, SlicePipe, UpperCasePipe, TitleCasePipe, KeyValuePipe, KeyValue} from './pipes/index';
+export {AsyncPipe, DatePipe, DATE_PIPE_DEFAULT_TIMEZONE, DATE_PIPE_DEFAULT_FORMAT, I18nPluralPipe, I18nSelectPipe, JsonPipe, LowerCasePipe, CurrencyPipe, DecimalPipe, PercentPipe, SlicePipe, UpperCasePipe, TitleCasePipe, KeyValuePipe, KeyValue} from './pipes/index';
 export {PLATFORM_BROWSER_ID as ɵPLATFORM_BROWSER_ID, PLATFORM_SERVER_ID as ɵPLATFORM_SERVER_ID, PLATFORM_WORKER_APP_ID as ɵPLATFORM_WORKER_APP_ID, PLATFORM_WORKER_UI_ID as ɵPLATFORM_WORKER_UI_ID, isPlatformBrowser, isPlatformServer, isPlatformWorkerApp, isPlatformWorkerUi} from './platform_id';
 export {VERSION} from './version';
 export {ViewportScroller, NullViewportScroller as ɵNullViewportScroller} from './viewport_scroller';

packages/common/src/pipes/date_pipe.ts

@@ -18,6 +18,12 @@ import {invalidPipeArgumentError} from './invalid_pipe_argument_error';
  */
 export const DATE_PIPE_DEFAULT_TIMEZONE = new InjectionToken<string>('DATE_PIPE_DEFAULT_TIMEZONE');
 
+/**
+ * Optionally-provided default format to use for all instances of `DatePipe` (such as `short`).
+ * If the value isn't provided, the `DatePipe` will default to 'mediumDate'.
+ */
+export const DATE_PIPE_DEFAULT_FORMAT = new InjectionToken<string>('DATE_PIPE_DEFAULT_FORMAT');
+
 // clang-format off
 /**
  * @ngModule CommonModule
@@ -185,13 +191,15 @@ export const DATE_PIPE_DEFAULT_TIMEZONE = new InjectionToken<string>('DATE_PIPE_
 export class DatePipe implements PipeTransform {
   constructor(
       @Inject(LOCALE_ID) private locale: string,
-      @Inject(DATE_PIPE_DEFAULT_TIMEZONE) @Optional() private defaultTimezone?: string|null) {}
+      @Inject(DATE_PIPE_DEFAULT_TIMEZONE) @Optional() private defaultTimezone?: string|null,
+      @Inject(DATE_PIPE_DEFAULT_FORMAT) @Optional() private defaultFormat?: string|null) {}
 
   /**
    * @param value The date expression: a `Date` object,  a number
    * (milliseconds since UTC epoch), or an ISO string (https://www.w3.org/TR/NOTE-datetime).
    * @param format The date/time components to include, using predefined options or a
-   * custom format string.
+   * custom format string.  When not supplied, either the value of the `DATE_PIPE_DEFAULT_FORMAT`
+   * injection token is used or the 'mediumDate' format.
    * @param timezone A timezone offset (such as `'+0430'`), or a standard UTC/GMT, or continental US
    * timezone abbreviation. When not supplied, either the value of the `DATE_PIPE_DEFAULT_TIMEZONE`
    * injection token is used or the end-user's local system timezone.
@@ -207,13 +215,14 @@ export class DatePipe implements PipeTransform {
       value: Date|string|number|null|undefined, format?: string, timezone?: string,
       locale?: string): string|null;
   transform(
-      value: Date|string|number|null|undefined, format = 'mediumDate', timezone?: string,
+      value: Date|string|number|null|undefined, format?: string, timezone?: string,
       locale?: string): string|null {
     if (value == null || value === '' || value !== value) return null;
 
     try {
       return formatDate(
-          value, format, locale || this.locale, timezone ?? this.defaultTimezone ?? undefined);
+          value, format ?? this.defaultFormat ?? 'mediumDate', locale || this.locale,
+          timezone ?? this.defaultTimezone ?? undefined);
     } catch (error) {
       throw invalidPipeArgumentError(DatePipe, (error as Error).message);
     }

packages/common/src/pipes/index.ts

@@ -13,7 +13,7 @@
  */
 import {AsyncPipe} from './async_pipe';
 import {LowerCasePipe, TitleCasePipe, UpperCasePipe} from './case_conversion_pipes';
-import {DATE_PIPE_DEFAULT_TIMEZONE, DatePipe} from './date_pipe';
+import {DATE_PIPE_DEFAULT_FORMAT, DATE_PIPE_DEFAULT_TIMEZONE, DatePipe} from './date_pipe';
 import {I18nPluralPipe} from './i18n_plural_pipe';
 import {I18nSelectPipe} from './i18n_select_pipe';
 import {JsonPipe} from './json_pipe';
@@ -24,6 +24,7 @@ import {SlicePipe} from './slice_pipe';
 export {
   AsyncPipe,
   CurrencyPipe,
+  DATE_PIPE_DEFAULT_FORMAT,
   DATE_PIPE_DEFAULT_TIMEZONE,
   DatePipe,
   DecimalPipe,