如何以角度形式实现验证器

时间:2019-09-02 12:30:03

标签: angular validation

我正在Angular中实现React Forms自定义验证器。我有8个字段,我想验证两个字段是否小于其他日期。 我不知道为什么,但是没有将错误返回表单。

有人可以帮我看看我做错了什么吗

我的目标是在dateLessThanValidator为true时显示div

JS

this.scheduleForm = this.formBuilder.group({
  searchText: [this.searchText],
  codEnd: [this.workschedule.codEnd, Validators.required],
  dataInicio: [this.workschedule.dataInicio, Validators.required],
  dataFim: [this.workschedule.dataFim, Validators.required],
  periodo: [this.workschedule.periodo, Validators.required],
  justificativa: [this.workschedule.justificativa, Validators.required],
  totalColaboradores: [this.workschedule.totalColaboradores],
  totalTerceiros: [this.workschedule.totalTerceiros]
},
  {
    validator: [dateLessThanValidator]
  });

export function dateLessThanValidator(c: AbstractControl) {
debugger;
const dataInicio = c.get('dataInicio');
const dataFim = c.get('dataFim');

if (!dataInicio || !dataFim) { return null; }

return (new Date(dataInicio.value) > new Date(dataFim.value)) ? c.setErrors({  'dateLessThan': true }) : null;
};

HTML     

    <div *ngIf="scheduleForm.errors && scheduleForm.errors.dateLessThan" class="alert alert-danger col-sm-12">A data de Início deve ser maior do que a data Fim</div>

1 个答案:

答案 0 :(得分:1)

您正在使用跨域验证。跨域验证的参数不是FormControl,而是FormGroup。请更改功能的签名。如有必要,请与https://medium.com/@realTomaszKula/angular-cross-field-validation-d94e0d063b61

再次确认