How to get formatted date value using kendo angular ui datepicker

Question

I just need to get the formatted value for date, can you help me in how can I achieve that in my component file

<form [formGroup]="form" (ngSubmit)="onSubmit(form.value)">
      <div class="form-group">
        <label for="symbol">Symbol</label>
        <input [formControl]="symbol" type="text" class="form-control" id="symbol" placeholder="Enter Symbol to filter">
      </div>
      <div class="form-group">
        <div class="row">
          <div class="col-xs-12 col-sm-6 example-col">
            <label for="histFromDate">From</label>
            <kendo-datepicker [formControl]="histFromDate" id="histFromDate" class="form-control" [format]="'MM-dd-yyyy'"></kendo-datepicker>
          </div>
          <div class="col-xs-12 col-sm-6 example-col">
            <label for="histToDate">To</label>
            <kendo-datepicker [formControl]="histToDate" id="histToDate" class="form-control" [format]="'MM-dd-yyyy'"></kendo-datepicker>
          </div>
        </div>
      </div>
      <div class="button-wrapper">
        <button [disabled]="!form.valid" type="submit" class="btn btn-default">Submit</button>
      </div>

    </form>

Answer 1

I dig around the api click here and found the answer below is the code

import { IntlService } from '@progress/kendo-angular-intl';

constructor(private intl: IntlService) {}

private formatValue(value?: Date): string {
    return value ? `${this.intl.formatDate(value, 'd')}` : '';
}