Angular material datepicker get value as string - angular8

Question

I have an Angular Material datepicker. I have formatted the date as I wish but now I can't figure out how to send the string which is in the form to the backend.
My html:
<mat-form-field>
<input matInput [formControl]="date" [matDatepicker]="dp" placeholder="Fill in a date">
<mat-datepicker-toggle matSuffix [for]="dp"></mat-datepicker-toggle>
<mat-datepicker #dp></mat-datepicker>
</mat-form-field>
My ts:
export const MY_FORMATS = {
parse: {
dateInput: 'LL',
},
display: {
dateInput: 'YYYY-MM-DD',
monthYearLabel: 'YYYY',
dateA11yLabel: 'LL',
monthYearA11yLabel: 'YYYY',
},
};
#Component({
selector: 'app-search',
templateUrl: './search.component.html',
styleUrls: ['./search.component.scss'],
providers: [
{provide: DateAdapter, useClass: MomentDateAdapter, deps: [MAT_DATE_LOCALE]},
{provide: MAT_DATE_FORMATS, useValue: MY_FORMATS, },
],
})
export class SearchComponent implements OnInit {
flightIDInput = new FormControl('WZZ1BW')
date = new FormControl("");
constructor(private dataMessageService: DataMessagesService) { }
ngOnInit() {
}
getMessages() {
console.log(this.date.value);
});
}
}
The value in my form is written as 2019-10-18, but when i call it with this.date or this.date.value it returns this massive object. How can I send the string "2019-10-18" to my backend?

Answer 1

You can format your date value by passing it into the below function in TS...
formatDate(date) {
var d = new Date(date),
month = '' + (d.getMonth() + 1),
day = '' + d.getDate(),
year = d.getFullYear();
if (month.length < 2) month = '0' + month;
if (day.length < 2) day = '0' + day;
return [year, month, day].join('-');}