Mat-DatePicker-[（ngModel）]-无法显示用户保存的日期

Question

有人可以告诉如何在Mat-Datepicker中显示用户保存的日期吗？

最初从get服务（嵌套对象的数据，从另一个组件调用的数据）获取endDate为null。进入编辑模式时。正在选择值并保存。在控制台中，它会打印选定的日期。但在广告网络中为空。

this.endDate: string;

<mat-form-field>
<input matInput [value] = "endDate" [matDatepicker]="myDatepicker"  name="endDate" [(ngModel)]="endDate">
<mat-datepicker-toggle matSuffix [for]="myDatepicker"></mat-datepicker-toggle>
<mat-datepicker #myDatepicker ></mat-datepicker>
</mat-form-field>

保存方式：

save(){
let obj = {
    endDate = this.endDate; // my ngModel
    }
}
updateChange(d){
this.endDate = d; // i can see the changed value here but not able to save
} 

用于保存数据的实际对象

const sample : OriginalModel = { 
demoKey : this.sample['key'].demo, 
demoKey2 : this.sample['key2'].demo2, 
endDate : this.endDate 
}

如何完成此操作以在编辑模式下显示用户保存的值？

请亲切地分享解决方案/可以正常工作的堆栈。

预先感谢

Answer 1

我不知道您为什么尝试将日期值包装到{}中，但是您可以使用以下语法来实现此目的，

您的组件方面，

sample: any = { demoKey: "", demoKey2: "", demoKey3: "", endDate: new Date }

在HTML方面，

<mat-form-field>
<input  matInput placeholder="demoKey1" name='demoKey' [(ngModel)]='sample.demoKey' >
...
</mat-form-field>

您不需要使用save函数来设置两种方式的绑定变量，而是尝试使用函数来控制台日志obj.endDate并查看魔术是如何发生的。

Here is您的案例中的stackblitz示例，希望对您有所帮助。