angularkendo-uiformatkendo-datepicker

How to Capitalize the First Letter of the Kendo-DatePicker format in Angular?


I have a kendo-datepicker and it's always displaying the format in the field like following. enter image description here

But I want to customize this as Month/Day/Year. Capitalize the first letter. Is it possible to customize like this.

.html

<form [formGroup]="myForm">

    <label for="address" class="col-sm-2 col-form-label">Date</label>
    
     <div class="col-sm-4">
    
         <kendo-datepicker formControlName="startingDate" format="MM/dd/yyyy">
         </kendo-datepicker>
    
      </div>
 </form>

.ts

myForm: FormGroup = new FormGroup({
    startingDate: new FormControl(""),
  });

Solution

  • It's fixed by overriding the k-input CSS class.

     :host::ng-deep .k-input {
            text-transform: capitalize;
          }