angular - 即使没有选择任何值，如何在表单中标记 ngbDatepicker 有效

Question

我在 Angular2 项目的响应式表单中使用 ng-bootstrap 的 ngbDatepicker，日期是可选的，但是 ngbDatepicker 始终将表单标记为无效，除非选择了日期。

有没有办法从表单验证中排除 ngbDatepicker，或者对其进行配置以使其返回 Valid 是否设置了值？

Answer 1

问题在于我如何初始化表单值。我将默认值设置为空字符串，我应该将日期初始化为空。所以我这样做了：

  replicantForm = this.fb.group({
      name: ['', Validators.required],
      incepdate: '',
      longevity: ''
  })

当我应该这样做时：

  replicantForm = this.fb.group({
      name: ['', Validators.required],
      incepdate: null,
      longevity: ''
  })

非常感谢@pkozlowski-opensource 的澄清。

Answer 2

为了响应已接受的答案以及它不适用于后续更新的事实，我使用以下技巧来确保控件在未插入或插入无效日期时有效。

如果您问我，更改验证器中的值非常讨厌，但是在 ngb-datepicker 内部设置值之前完成工作。

所需控件上的自定义验证器：

validateOptionalDate(control: AbstractControl) {
  if (!(control.value instanceof Object) && control.value !== null) {
    control.patchValue(null, {
      onlySelf: true,
      emitEvent: false,
      emitModelToViewChange: true,
      emitViewToModelChange: false
    });
  }
}