当日期格式为D/M/YYYY时，DatePicker掩码不显示粘贴日期
当日期格式为D/M/YYYY时，DatePicker掩码不显示粘贴日期
提问于 2021-09-09 14:36:55
我正在使用Angular2-Text-Mask在Mat-Date-Picker控件上实现掩码。除复制-粘贴操作外，其他控件均正常工作。
在粘贴日期为09-08-2015时，>>日期选择器将正确获取日期。粘贴日期为19-08-2015 >>数据选择器正确获取日期。在将日期粘贴为2015年9月8日时，>>日期选择器不会显示任何数据，直到您将焦点移开。虽然它在焦点转移后正确显示日期。
下面是HTML和Mask的代码片段
<mat-form-field [textMask]="{mask: mask, keepCharPositions: true, pipe: autoCorrectedDatePipe,guide:true}" >
<mat-label>Employment Date</mat-label>
<input matInput formControlName="EmploymentDate"
[matDatepicker]="EmploymentDate"
<mat-datepicker-toggle matSuffix [for]="EmploymentDate"></mat-datepicker-toggle>
<mat-datepicker #EmploymentDate></mat-datepicker>
</mat-form-field>下面是掩码：
公网掩码= [/0-9/，/0-9/，'/'，/0-9/，/0-9/，'/'，/0-9/，/0-9/，/0-9/，/0-9/，/0-9/]；公网autoCorrectedDatePipe: any = createAutoCorrectedDatePipe('dd/mm/yyyy')；
欢迎任何建议！
回答 1
Stack Overflow用户
发布于 2021-09-09 20:49:03
因此，我通过扩展NativeDateAdapter类和更新parse函数解决了这个问题。
@Injectable()
export class AppDateAdapter extends NativeDateAdapter {
parse(value: any): Date | null {
if (!value) {
return null;
}
// check whether user is using /, . or - for entering dates
if (value.search('/' || '.' || '-') !== -1) {
return new Date(value);
} else {
let day;
let month;
let year;
// Converts 02022021
if (value.length === 8) {
month = +value.substring(0, 2);
day = +value.substring(2, 4);
year = +value.substring(4, 8);
}
return new Date(year, month - 1, day);
}
}
}您还需要在导入MatDatePicker的每个模块中或在根目录下提供您的DateAdapter (在我看来，更适合较大的应用程序，以减少冗余)。
providers: [
{
provide: DateAdapter,
useClass: CustomDateAdapter
},
]页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/69120163
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号