[英]Mat-datepicker value autoselected
我正在创建一个提醒应用程序,但无法在 mat-datepicker 中设置日期(更像是预填充)。 我有一个 object
resObj = {
"taskId": 230,
"whenToDo": "2020-05-10T00:00:00.000+0000",
"wherToGo": "CityHall",
"whatTodo": "Talk to mentor"
}
在 .ts 文件中,我将 ngOnit() 上的日期格式更改为 10/04/2020
this.doj = this.resObj.dojs
this.doj = new DatePipe('en-US').transform(this.resObj.dojs, 'dd/MM/yyyy')
并在 HTML
<mat-form-field>
<input [(ngModel)]="doj" name="dojs" matInput [matDatepicker]="picker" placeholder="Date of Joining">
<mat-icon matSuffix>
<img src="../../../assets/images/icons/purple_icons/icon-calendar.png" (click)="picker.open()">
</mat-icon>
<mat-datepicker #picker touchUi></mat-datepicker>
</mat-form-field>
有没有办法我们可以设置上面的日期,当用户打开页面时在日期选择器中选择,并且从“今天和之前的日期”开始的日期应该被禁用。
您可以通过添加[formControl]
来设置默认日期。 您可以设置[min]
值以禁用今天之前的几天。
<mat-form-field>
<input [(ngModel)]="doj" name="dojs" matInput [matDatepicker]="picker" placeholder="Date of Joining"
[formControl]="defaultDate" [min]="minDate">
<mat-icon matSuffix>
<img src="../../../assets/images/icons/purple_icons/icon-calendar.png" (click)="picker.open()">
</mat-icon>
<mat-datepicker #picker touchUi></mat-datepicker>
</mat-form-field>
并在 .ts 文件中设置值。
defaultDate = new FormControl(new Date(resObj.whenToDo))
要禁用今天和过去几天,
minDate: Date;
ngOnInit() {
this.minDate = new Date();
this.minDate.setDate(this.minDate.getDate() + 1)
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.