手动输入日期格式答案

【问题标题】：Manual typing format of date手动输入日期格式
【发布时间】：2020-03-11 05:58:45
【问题描述】：

我使用ng-pick-datetime 来选择和显示日期。我已在构造函数中使用dateTimeAdapter.setLocale('en-IN') 将日期格式更改为DD/MM/YYYY。如果我单击日历并选择格式为DD/MM/YYYY 的日期，但如果我手动输入03/28/2019，它仍然接受。我想限制除DD/MM/YYYY 之外的其他格式，即使在打字时也是如此。请帮帮我。

代码

<input (ngModelChange)="onChangeDate($event)" [(ngModel)]="dob" name="date" [owlDateTimeTrigger]="dt1" [owlDateTime]="dt1" required>
<owl-date-time class="" [pickerType]="'calendar'" [startView]="'multi-years'" #dt1></owl-date-time>

import { DateTimeAdapter } from 'ng-pick-datetime';
constructor(dateTimeAdapter: DateTimeAdapter<any>){dateTimeAdapter.setLocale('en-IN');}

【问题讨论】：

您可以在onChangeDate事件中进行验证
请检查这个答案：stackoverflow.com/questions/48702408/…
用于打字？ @RameshRajendran
我仍然可以手动输入@RameshRajendran
为什么你允许在那个文本框中输入？用户真的需要它吗？

标签： javascript angular typescript date

【解决方案1】：

有几种方法可以验证您的输入。在这里，我为您的问题提供了解决方案。

https://stackblitz.com/edit/ng-pick-datetime-format-i18n-qwhyb3?embed=1&file=src/app/app.component.html

我已将输入类型添加为“文本”、您需要的模式“DD/MM/YYYY”和背景 css 以获得输入标签的有效和无效状态。

<input type="text" pattern="^([0-2][0-9]|(3)[0-1])(\/)(((0)[0-9])|((1)[0-2]))(\/)\d{4}$" (ngModelChange)="onChangeDate($event)" [(ngModel)]="dob" name="date" [owlDateTimeTrigger]="dt1" [owlDateTime]="dt1" required>

【讨论】：