0

我正在尝试验证此生日表格?

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>

打字稿

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])'),
       ]),
    });
}

我正在使用反应式表单构建器来验证其他字段,如用户名、密码......我也在这里发现了这个问题,建议使用 moment.js 但很困惑。无法弄清楚如何使用带有此表单的时刻 js 来验证上面提到的生日字段。

4

3 回答 3

0

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

使用 Angular Reactive Forms 验证年龄是否超过 18 岁

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

于 2018-11-09T17:31:36.547 回答
0

您需要为您的生日表单创建一个新的表单组,然后您可以针对一个正则表达式验证每个控件:Day、Month、Year,以确保组合值符合您想要的格式(例如,2018 年 11 月 11 日)。

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

于 2018-11-06T09:48:01.313 回答
0

我读了你的评论,我相信你真的不希望这些被select输入。您应该使用datepicker具有反应形式的适当插件。

您应该了解ng-bootstrap哪些提供ngbDatepicker可以以您想要的所有方式为您提供帮助 - 验证和实际的日期选择器。它提供了与反应形式的集成。

希望这可以帮助。!

于 2018-11-06T12:55:41.360 回答