Почему значение не заполняется внутри ввода в mat datepicker?

Question

У меня есть текущий шаблон:

<input type="text" class="form-control" name="my_date" 
        [matDatepicker]="myDatepicker" #myDate="ngModel"        
        [(ngModel)]="myDateValue" id="my_date" required>                                        
    <mat-datepicker-toggle [for]="myDatepicker"></mat-datepicker-toggle>                                                                                
    <mat-datepicker #myDatepicker></mat-datepicker>  

Инициализация происходит при загрузке компонента:

public myDateValue: string;
    this.myDateValue= myMonth.toString() + "\/" + myDay.toString() + "\/" + myYear.toString(); 

При выводе даты в консоль я вижу ее в значении FormControl. Но при загрузке страницы дата не заполняется в текстовое поле?

Есть идеи, что я делаю не так? Благодарю.

Answer 1

Чтобы решить эту проблему, мне пришлось изменить myDateValue на тип Date. Это решило проблему. mat datepicker требует, чтобы поле имело тип Date.

Answer 2

в моем случае привязка к значению была такой:

      <input type="text" class="form-control" name="my_date" 
    [matDatepicker]="myDatepicker" #myDate="ngModel"        
    [value]="myDateValue|date" id="my_date" required>                                        
<mat-datepicker-toggle [for]="myDatepicker"></mat-datepicker-toggle>                                                                                
<mat-datepicker #myDatepicker></mat-datepicker>    

я удалил- | свидание

и тогда это сработало

       <input type="text" class="form-control" name="my_date" 
    [matDatepicker]="myDatepicker" #myDate="ngModel"        
    [value]="myDateValue" id="my_date" required>                                        
<mat-datepicker-toggle [for]="myDatepicker"></mat-datepicker-toggle>                                                                                
<mat-datepicker #myDatepicker></mat-datepicker>