diff --git a/src/demos/timepicker/timepicker-demo.component.html b/src/demos/timepicker/timepicker-demo.component.html
index e0b9e442c..7d5a7b196 100644
--- a/src/demos/timepicker/timepicker-demo.component.html
+++ b/src/demos/timepicker/timepicker-demo.component.html
@@ -64,7 +64,6 @@
diff --git a/src/modules/timepicker/timepicker-component.spec.ts b/src/modules/timepicker/timepicker-component.spec.ts
index 27ef3dd72..bb5e8534b 100644
--- a/src/modules/timepicker/timepicker-component.spec.ts
+++ b/src/modules/timepicker/timepicker-component.spec.ts
@@ -86,7 +86,7 @@ describe('Timepicker', () => {
let units = sections.item(0).querySelectorAll('.sky-timepicker-column');
let hours = units.item(0).querySelectorAll('button');
let minutes = units.item(1).querySelectorAll('button');
- if (component.timeFormat === 'hh') {
+ if (component.timeFormat === 'hh' || !component.timeFormat) {
let meridies = units.item(2).querySelectorAll('button');
expect(hours.item(0)).toHaveText('1');
expect(hours.item(11)).toHaveText('12');
@@ -108,6 +108,16 @@ describe('Timepicker', () => {
}
}
+ it('should default to the twelve hour timepicker without timeFormat', fakeAsync(() => {
+ fixture.detectChanges();
+ component.timeFormat = undefined;
+ fixture.detectChanges();
+ tick();
+ fixture.detectChanges();
+ openTimepicker(nativeElement, fixture);
+ verifyTimepicker(nativeElement);
+ }));
+
it('should have the twelve hour timepicker', fakeAsync(() => {
fixture.detectChanges();
component.timeFormat = 'hh';
diff --git a/src/modules/timepicker/timepicker.directive.ts b/src/modules/timepicker/timepicker.directive.ts
index 57097d7d8..2e4a70407 100644
--- a/src/modules/timepicker/timepicker.directive.ts
+++ b/src/modules/timepicker/timepicker.directive.ts
@@ -52,12 +52,18 @@ export class SkyTimepickerInputDirective implements
OnInit, OnDestroy, ControlValueAccessor, Validator, OnChanges {
public pickerChangedSubscription: Subscription;
+ private _timeFormat: string = 'hh';
@Input()
public skyTimepickerInput: SkyTimepickerComponent;
@Input()
- public timeFormat: string;
+ public set timeFormat(value: string) {
+ this._timeFormat = value;
+ }
+ public get timeFormat(): string {
+ return this._timeFormat || 'hh';
+ }
@Input()
public returnFormat: string;