fix(localization): Fix date time editor default display format not taking into account format type. Fix tests.

Author: skrustev

projects/igniteui-angular/src/lib/date-common/util/date-time.util.ts

@@ -253,6 +253,12 @@ export abstract class DateTimeUtil {
         return formatter.getLocaleDateTimeFormat(locale, true, DateTimeUtil.getFormatOptions(dataType));
     }
 
+    /** Builds a date-time editor's default display format based on provided locale settings and data type. */
+    public static getDefaultDisplayFormat(locale: string, formatter: BaseFormatter, dataType: DataType = DataType.Date): string {
+        locale = locale || DateTimeUtil.DEFAULT_LOCALE;
+        return formatter.getLocaleDateTimeFormat(locale, false, DateTimeUtil.getFormatOptions(dataType));
+    }
+
     /** Determines if a given character is `d/M/y` or `h/m/s`. */
     public static isDateOrTimeChar(char: string): boolean {
         return DATE_CHARS.indexOf(char) !== -1 || TIME_CHARS.indexOf(char) !== -1;

projects/igniteui-angular/src/lib/directives/date-time-editor/date-time-editor.directive.spec.ts

@@ -158,13 +158,13 @@ describe('IgxDateTimeEditor', () => {
                 let change: SimpleChange = new SimpleChange('date', 'dateTime', false);
                 let changes: SimpleChanges = { defaultFormatType: change };
                 dateTimeEditor.ngOnChanges(changes);
-                expect(dateTimeEditor.inputFormat.normalize('NFKC')).toEqual('MM/dd/yyyy, hh:mm:ss tt');
+                expect(dateTimeEditor.inputFormat.normalize('NFKC')).toEqual('MM/dd/yyyy, hh:mm:ss a');
 
                 dateTimeEditor.defaultFormatType = 'time';
                 change = new SimpleChange('dateTime', 'time', false);
                 changes = { defaultFormatType: change };
                 dateTimeEditor.ngOnChanges(changes);
-                expect(dateTimeEditor.inputFormat.normalize('NFKC')).toEqual('hh:mm tt');
+                expect(dateTimeEditor.inputFormat.normalize('NFKC')).toEqual('hh:mm a');
             });
         });
 

projects/igniteui-angular/src/lib/directives/date-time-editor/date-time-editor.directive.ts

@@ -140,7 +140,7 @@ export class IgxDateTimeEditorDirective extends IgxMaskDirective implements OnCh
     }
 
     public get displayFormat(): string {
-        return this._displayFormat || this._inputFormat ||  this._i18nFormatter.getLocaleDateTimeFormat(this.locale);
+        return this._displayFormat || this._inputFormat || DateTimeUtil.getDefaultDisplayFormat(this.locale, this._i18nFormatter, this.defaultFormatType);
     }
 
     /**

projects/igniteui-angular/src/lib/grids/grid/grid-filtering-ui.spec.ts

@@ -521,7 +521,7 @@ describe('IgxGrid - Filtering Row UI actions #grid', () => {
             dateTimeEditor = filterUIRow.query(By.directive(IgxDateTimeEditorDirective))
                                                 .injector.get(IgxDateTimeEditorDirective);
             // since 'shortTime' is numeric, input format will include its numeric parts
-            expect(dateTimeEditor.inputFormat.normalize('NFKC')).toMatch('hh:mm tt');
+            expect(dateTimeEditor.inputFormat.normalize('NFKC')).toMatch('hh:mm a');
             expect(dateTimeEditor.displayFormat).toMatch('shortTime');
         }));
 

projects/igniteui-angular/src/lib/time-picker/time-picker.component.spec.ts

@@ -1557,7 +1557,7 @@ describe('IgxTimePicker', () => {
             it('should set placeholder correctly', fakeAsync(() => {
                 // no inputFormat set - placeholder equals the default date time input format
                 let inputEl = fixture.nativeElement.querySelector(CSS_CLASS_INPUT);
-                expect(inputEl.placeholder.normalize('NFKC')).toEqual('hh:mm tt');
+                expect(inputEl.placeholder.normalize('NFKC')).toEqual('hh:mm aa');
 
                 // no placeholder - set to inputFormat, if it is set
                 // test with the different a,aa,.. ampm formats