Date picker variables

I have been attempting to design a date range filter for my data, and made a test function to change variables to start date and end date. The code displays the correct date when called directly, but when printing the variables, it doesn't print correctly.

Component.html:

<div class="search">
    <input type="text" matInput
    id = 'calander'
    ngxDaterangepickerMd
    [locale]="{ 
      cancelLabel: 'Cancel',
      applyLabel: 'Okay',
      clearLabel: 'Clear',
      format: 'YYYY/MM/DD'
    }"
    startKey="start"
    endKey="end"
    [(ngModel)]="selected"
    name="daterange"
    (ngModelChange)="doSomething($event)"/>
    <button class="ripple" type="submit" ></button>
</div>

Component.ts:

  startDate: Moment;
  endDate: Moment;

  doSomething(event){
    console.log(event) // input value is logged
    alert(event.start); 

    this.startDate = event.start;
    this.endDate = event.end;
    alert('start: ' + this.startDate + '\nend: ' + this.endDate);
 }

1st Alert 2nd Alert

In your case date values are assigned to other variable in milliseconds that's why you are seeing date-time in a long integer value.

You have to create a new Date() object in order to get the desired date-time format.

this.startDate = new Date(event.start);
this.endDate = new Date(event.end);

You can get help about date formats from Date syntax (MDN).