Question

我正在尝试使用表单自定义验证器让我的验证器正确显示，但是我不确定如何调用它。我在html端尝试了BroadcastForm.controls.errors.customTimeValidator（），但无法正常工作。感谢您的帮助！

broadcast.component.ts

ngOnInit() {
    this.BroadcastForm = this.fb.group({
        datetime: [
            datetime,
            Validators.compose([Validators.required, this.customTimeValidator()]),
        ],
    });
}

customTimeValidator(): ValidatorFn {
    return (control: AbstractControl): { [key: string]: any } | null => {
        const minDate = new Date();
        minDate.setSeconds(0);
        this.minTime = minDate.getTime() + 59 * 1000;
        const forbidden = control.value <= minDate;
        return forbidden ? { forbiddenName: { value: control.value } } : null;
};
}

broadcast.component.html

<div class="validation-error" *ngIf="
   BroadcastForm.controls.datetimeOption.value === 'false' &&
   BroadcastForm.controls.errors.customTimeValidator()"> //how do I call customTimeValidator correctly?
   Please select a future date/time
 </div>

Answer 1

更改此

BroadcastForm.controls.errors.customTimeValidator()

到

BroadcastForm.controls['datetime']['errors']['forbiddenName']

实际上，您可以使用json管道找到所有错误

{{ BroadcastForm.controls['datetime']['errors'] | json }}

Answer 2

很抱歉，无论是查看还是使用，公认的答案都是令人作呕的。

使用更简单，更干净且有据可查的东西：

BroadcastForm.get('datetime').hasError('forbiddenName')

Angular（2/4/5/6）自定义验证器错误消息未显示

2 个答案: