如何在Angular的注册表单中验证此生日表单？

我正在尝试验证此生日表

HTML

  <div class="row">
    <div class="col-md-4">
      <div class="form-group">
  <input type="text" class="form-control" id="usr" placeholder="Day">
</div>
    </div>
    <div class="col-md-4">
      <div class="form-group">
  <select class="form-control" id="sel1">
    <option value="" disabled selected>Month</option>
    <option>January</option>
    <option>February</option>
    <option>March</option>
  </select>
</div>
    </div>
     <div class="col-md-4">
      <div class="form-group">
  <input type="text" class="form-control" id="usr" placeholder="Year">
</div>
    </div>

我正在使用反应式表单生成器验证用户名、密码等其他字段。。。

---

我在这里还发现了这个问题，建议在哪里使用矩.js，但我感到困惑。无法弄清楚如何在此表单中使用矩js来验证上述生日字段的矩。

您需要为您的生日表单创建一个新的表单组，然后您可以根据正则表达式验证每个控件：天、月、年，以确保组合值符合您希望的格式（11/11/18）比如说

---

除非您试图预填充日期，否则您不需要使用Moment.js，即使这样，这与验证无关，而是需要验证它生成的日期。

您需要为您的生日表单创建一个新表单组，然后您可以验证每个控件：天、月、，例如，与确保组合值符合所需格式（11/11/18）的正则表达式相对应的年份

---

除非您试图预填充日期，否则您不需要使用Moment.js，即使这样，这也与验证无关，而是需要验证它生成的日期。

我阅读了您的评论，我相信您确实不希望这些是

选择

输入。您应该使用适当的

日期选择器

插件和反应式表单

您应该通过

ng bootstrap

，它提供了

ngbDatepicker

，可以以您想要的方式帮助您-验证和实际日期选择器。它提供了与反应形式的集成

---

希望这有帮助

我读了你的评论，我相信你真的不希望这些是

select

input。您应该使用适当的

日期选择器

插件和反应式表单

您应该通过

ng bootstrap

，它提供了

ngbDatepicker

，可以以您想要的方式帮助您-验证和实际日期选择器。它提供了与反应形式的集成

---

希望这有帮助

检查解决类似问题的答案：

---

非常详细。此外，还包括一个工作示例。如果您不需要检查人们是否超过18岁，您可以忽略最后一部分。

检查解决类似问题的答案：

---

---

非常详细。此外，还包括一个工作示例。如果你不需要检查人们是否超过18岁，你可以忽略最后一部分。

嘿，伙计，你的问题是什么？嘿！如何在我的typescript表单组中验证上述HTML生日表单？我认为应该使用momente.js，但不知道如何在这个特定的表单中使用这个特定的案例？@jburtondev这是非常糟糕的行为，只是因为你不能回答这个问题而拒绝投票并删除答案。我没有否决你的回答。所以没有必要否决这个问题！公平地说，我正试图再次否决你的答案。我对你的评论的问题是，我花时间理解了你的答案，但是你强调了解决方案的问题（这是可以的），但是你的评论是矛盾的。只是想帮助mate。正如你从其他问题中看到的那样，如果看到一个有效的解决方案，我会标记所有问题都已解决，但决不会否决任何答案，因此不需要删除答案：）我看了这个例子：但不确定他是如何使用它的。嘿，伙计，你的问题到底是什么？嘿！如何在我的typescript表单组中验证上述HTML生日表单？我认为应该使用momente.js，但不知道如何在这个特定的表单中使用这个特定的案例？@jburtondev这是非常糟糕的行为，只是因为你不能回答这个问题而拒绝投票并删除答案。我没有否决你的回答。所以没有必要否决这个问题！公平地说，我正试图再次否决你的答案。我对你的评论的问题是，我花时间理解了你的答案，但是你强调了解决方案的问题（这是可以的），但是你的评论是矛盾的。只是想帮助mate。正如您可能从其他问题中看到的那样，如果看到一个有效但从不否决任何答案的解决方案，我会将所有问题标记为已解决，因此不需要删除答案：）我查看了这个示例：但不确定他是如何使用它的。为什么不在现有表单组中验证它？同样晚了，我需要创建一个管道，将其转换为用户的年龄，这可能不需要片刻吗？可以，但选择标记尚未链接到表单。它需要表单控件属性。此解决方案中还有另一个问题。有31天的月份和30天的月份，也有2月28日或29日。这就是为什么仅仅通过表单组功能，这个解决方案是不够的。关键是，如何将矩与它一起使用？为什么不在现有的表单组中验证它？同样晚了，我需要创建一个管道，将其转换为用户的年龄，这可能不需要片刻吗？可以，但选择标记尚未链接到表单。它需要表单控件属性。此解决方案中还有另一个问题。有31天的月份和30天的月份，也有2月28日或29日。这就是为什么仅仅通过表单组功能，这个解决方案是不够的。关键是，如何使用Moment with Itt感谢回复，但我试图忽略所有其他库。我不使用ng-bootstrap。感谢您的回复，但我正在尝试忽略所有其他库。我不使用ng引导。

ngOnInit() {
 this.SignupForm = new FormGroup({
       'username': new FormControl(null, [Validators.required,
      Validators.pattern('(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])'),
       ]),
       'name': new FormControl(null, [Validators.required,
      Validators.pattern('(?=.*[a-z])(?=.*[A-Z])'),
       ]),
      'email': new FormControl(null, [Validators.required, Validators.email], this.forbiddenEmails),
      'password': new FormControl(null, [Validators.required,
      Validators.pattern('(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[$@$!%*?&])[A-Za-z\d$@$!%*?&].{8,}'),
       ]),
       'phone': new FormControl(null, [Validators.required,
      Validators.pattern('(?=.*[0-9])'),
       ]),
    });
}