refactor(time-picker): addressing comments #6482

Author: PlamenaMiteva

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

@@ -368,7 +368,7 @@ export class IgxDateTimeEditorDirective extends IgxMaskDirective implements OnCh
       return { value: true };
     }
 
-    let errors;
+    let errors = {};
     const valueDate = DateTimeUtil.isValidDate(control.value) ? control.value : this.parseDate(control.value);
     const minValueDate = DateTimeUtil.isValidDate(this.minValue) ? this.minValue : this.parseDate(this.minValue);
     const maxValueDate = DateTimeUtil.isValidDate(this.maxValue) ? this.maxValue : this.parseDate(this.maxValue);
@@ -555,7 +555,7 @@ export class IgxDateTimeEditorDirective extends IgxMaskDirective implements OnCh
       return false;
     }
 
-    let errors;
+    let errors = {};
     const minValueDate = DateTimeUtil.isValidDate(this.minValue) ? this.minValue : this.parseDate(this.minValue);
     const maxValueDate = DateTimeUtil.isValidDate(this.maxValue) ? this.maxValue : this.parseDate(this.maxValue);
     if (minValueDate || maxValueDate) {

projects/igniteui-angular/src/lib/time-picker/time-picker.component.html

@@ -6,6 +6,10 @@
         [displayFormat]="this.displayFormat" [igxTextSelection]="this.isDropdown" role="combobox" aria-haspopup="dialog"
         [attr.aria-expanded]="!this.toggleDirective.collapsed" [attr.aria-labelledby]="this.label?.id" />
 
+    <igx-prefix *ngIf="!this.toggleComponents.length" (click)="this.toggle()">
+        <igx-icon fontSet="material">access_time</igx-icon>
+    </igx-prefix>
+
     <ng-container ngProjectAs="[igxLabel]">
         <ng-content select="[igxLabel]"></ng-content>
     </ng-container>
@@ -19,10 +23,6 @@
         <ng-content select="igx-hint,[igxHint]"></ng-content>
     </ng-container>
 
-    <igx-prefix *ngIf="!this.toggleComponents.length" (click)="this.toggle()">
-        <igx-icon fontSet="material">access_time</igx-icon>
-    </igx-prefix>
-
     <igx-suffix *ngIf="this.showClearButton" igxRipple (click)="this.clear()">
         <igx-icon fontSet="material">clear</igx-icon>
     </igx-suffix>

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

@@ -601,7 +601,7 @@ describe('IgxTimePicker', () => {
             it('should select minValue when value does not match dropdown values', fakeAsync(() => {
                 fixture.componentInstance.minValue = new Date(2021, 24, 2, 9, 0, 0);
                 fixture.componentInstance.maxValue = new Date(2021, 24, 2, 16, 0, 0);
-                timePicker.itemsDelta = {hour:2, minute: 15, second: 30}
+                timePicker.itemsDelta = {hour:2, minute: 15, second: 30};
                 fixture.detectChanges();
 
                 timePicker.open();
@@ -621,7 +621,7 @@ describe('IgxTimePicker', () => {
             it('should select minValue when value is outside the min/max range', fakeAsync(() => {
                 fixture.componentInstance.minValue = new Date(2021, 24, 2, 13, 0, 0);
                 fixture.componentInstance.maxValue = new Date(2021, 24, 2, 19, 0, 0);
-                timePicker.itemsDelta = {hour:2, minute: 15, second: 30}
+                timePicker.itemsDelta = {hour:2, minute: 15, second: 30};
                 fixture.detectChanges();
 
                 timePicker.open();