Angular SetValidators 模式有效日期 RegEx 错误

Question

我在这里阅读了几篇关于使用正则表达式验证日期表单控件的文章，但其中大多数都使用自定义日期验证代码。我正在尝试使用模式方法中的日期正则表达式来获取反应形式的 setValidators 方法。我发现了一些日期正则表达式，但我收到一个错误，即使对于有效的 MM/DD/YYYY 格式也会触发验证错误。

对于正则表达式，我尝试了以下字符串

datePattern1: string = '^\d{2}\/\d{2}\/\d{4}$';

datePattern1: string = '^(0?[1-9]|[12][0-9]|3[01])[/-](0?[1-9]|1[012])[/-]\d{4}$';

对于Reactive Form日期控件是TS代码

 startDate?.setValidators([Validators.required, 
                Validators.pattern(this.datePattern1)];

在HTML代码中

<input type="date" class="form-control form-cntrl" formControlName="startDt"  aria-label="Start Date"
              [ngClass]="{'has-error': (startDt.invalid && startDt.touched)}" >
              <span *ngIf="startDt.invalid && startDt.touched">
                <br/>
                <small *ngIf="startDt.errors.required" class="text-danger">Start Date is required</small>
                <small *ngIf="startDt.errors.pattern" class="text-danger">Start Date Format MM/DD/YYYY is invalid</small>
              </span>

所需的验证器工作正常。但是日期格式总是触发。我尝试了从几篇文章中找到的 3 个正则表达式字符串，但无法正常工作。

任何帮助都会很棒！谢谢！

Answer 1

我过去也遇到过同样的问题。根据我的经验，您最好将模式直接定义为格式为 /regexp/ 的 RegExp。因为如果你使用字符串，你还必须转义反斜杠才能工作，而且很容易忘记。

例如，您的第一个模式可以是：

datePattern1: RegExp = /^\d{2}\/\d{2}\/\d{4}$/

或者使用字符串应该是：

datePattern1: string = '^\d{2}\/\d{2}\/\d{4}$'

干杯

Angular SetValidators 模式有效日期 RegEx 错误

Angular SetValidators Pattern Valid Date RegEx error

regex

validation

angular