Выбор даты углового материала не заполняет предварительно значение из ответа Laravel API

Question

У меня есть поле выбора даты Угловой материал в форме. Форма связана с конечной точкой API, созданной с помощью Laravel. Когда я выбираю дату в представлении «создать бронирование» и отправляю форму в конечную точку, все работает, дата корректно сохраняется в базе данных. Однако когда я загружаю форму и выполняю запрос GET и связываю ответ с формой в представлении «Изменить бронирование», поле НЕ заполняется датой и временем.

Вот мое поле выбора даты:

<mat-form-field>
    <input matInput [matDatepicker]="datePicker" placeholder="Booking date" [ngModel]="booking?.date" name="date" required>
    <mat-datepicker-toggle matSuffix [for]="datePicker"></mat-datepicker-toggle>
    <mat-datepicker #datePicker></mat-datepicker>
</mat-form-field>

Вот мой ответ JSON:

{
    "id": 23,
    "consultant_id": 1669,
    "teacher_id": null,
    "school_id": 6,
    "date": "2018-11-26 00:00:00"
}

Вот мой файл компонента:

export class BookingEditComponent implements OnInit {
    public loading: boolean = false;
    public booking: any;
    public booking_id: number;

constructor(
    private bookingService: BookingService,
    private router: Router,
    private activatedRoute: ActivatedRoute,
) { }

ngOnInit() {
    this.activatedRoute.params.subscribe(params => {
        this.booking_id = +params['booking_id'];
        this.getBooking(this.booking_id);
    })
}

public getBooking(booking_id: number): void {
    this.bookingService
        .getBooking(booking_id)
        .subscribe(booking => this.booking = booking);
}

public updateBooking(form: any): void {
    var item = form.value;
    this.bookingService
        .updateBooking(this.booking_id, item)
        .subscribe();
}

Answer 1

<mat-form-field>
 <input matInput [matDatepicker]="datePicker" placeholder="Booking date" [ngModel]="booking?.date" name="date" required>
 <mat-datepicker-toggle matSuffix [for]="datePicker"></mat-datepicker-toggle>
 <mat-datepicker #datePicker [startAt]="startDate"></mat-datepicker>
</mat-form-field>

file.ts

startDate;

public getBooking(booking_id: number): void {
this.bookingService
    .getBooking(booking_id)
    .subscribe(booking => {
      this.booking = booking
      startDate = new Date(booking.date);
    };
}

найдено в https://material.angular.io/components/datepicker/examples в поле «Дата начала выбора даты»