时间戳

首页 > 解决方案 > Angular中特定格式的日期验证

javascript - Angular中特定格式的日期验证

问题描述

我希望我的日期字段有一个验证，只允许接受的格式，例如

const ACCEPTED_DATE_FORMATS = [
  'MM/DD/YYYY', 'M/D/YYYY', 'MM/D/YYYY', 'M/DD/YYYY',
  'MM/DD/YY', 'M/D/YY', 'MM/D/YY', 'M/DD/YY',
  'DD.MM.YYYY', 'D.M.YYYY', 'D.MM.YYYY', 'DD.M.YYYY',
  'DD.MM.YY', 'D.M.YY', 'D.MM.YY', 'DD.M.YY'];

这是我的日期表格

  dateForm = new FormGroup({
    startDate: new FormControl(''),
    endDate: new FormControl('')
  });

我如何使用验证来做到这一点？我不熟悉正则表达式...... Validators.Required也不type="date"是我想要的。

Angular 是否有一个特殊的验证器或者我必须编写一个自定义验证器？

我发现 American Date 的正则表达式是：

(0[1-9]|1[0-2])\/(0[1-9]|[1-2][0-9]|3[0-1])\/[0-9]{4}

编辑：

/^(0?[1-9]|[12][0-9]|3[01])[\/\-](0?[1-9]|1[012])[\/\-]\d{4}$/

接受 YYYY/MM/DD 和 DD/MM/YYYY。

对于其他接受的格式，我需要你的帮助

标签： javascriptangularregextypescript

解决方案

你有几个选择

  • 如果您使用的是反应形式
    • 您可以使用内置的正则表达式验证器
    • startDate: new FormControl('', Validators.pattern('[a-zA-Z ]*') )
      • 将您的自定义模式插入到您需要的内容中
      • 在您的情况下，由于您有多种模式，因此您的正则表达式模式将类似于
        • ^\d{2}\/\d{2}\/\d{4}|\d{1}\/\d{1}\/\d{4}$
        • 我只在这里添加了你的前两个模式。您可以根据需要添加更多
    • 如果您希望应用更复杂的逻辑，或者创建自定义验证器。
  • 如果您使用的是模板表单
    • 在输入上使用模式属性
    • IE<input name="firstName" ngModel pattern="[a-zA-Z ]*">

推荐阅读