В этой демонстрации я создал образец формы для настраиваемого валидатора, здесь у меня есть From date и TO date и from time и To time, работает нормально: для from date и to date проверка работает нормально и показывает сообщения об ошибках.
проблема: при выборе той же даты, например, 21 июля 2018 года с даты и того же в To dat e и In с Time быть 4:00 Am и To Time быть 3:00 AM, strong> условие удовлетворяется, но при этом не отображается сообщение об ошибке. Что-то пошло не так при реализации, может ли кто-нибудь помочь мне решить
В html я дал сообщение проверки, но оно не отображается.
To Time:
<input type="time" formControlName="ToTime">
<mat-error *ngIf="DaterForm.get('ToTime').hasError('InValidToTime')">FromTime Should be less than ToTime if choose a same date</mat-error>
В компоненте:
DaterForm : FormGroup;
constructor(private fb:FormBuilder){
}
ngOnInit(){
this.DaterForm = this.fb.group(
{
FromDate:['',[AppCustomDirective.fromDateValidator]], // validation working fine
FromTime:[''],
ToDate:['',[AppCustomDirective.ToDateValidator]],// validation working fine
ToTime:['']
},{validator:[AppCustomDirective.timeValidator] // validation not working
}
Пользовательская проверка:
import { AbstractControl, FormControl, FormGroup, ValidatorFn, Validators } from '@angular/forms';
export class AppCustomDirective extends Validators{
static fromDateValidator(fdValue: FormControl) {
const date = fdValue.value;
console.log('x');
if (date ===null || date==='') return { requiredFromDate: true };
}
static ToDateValidator(todValue: FormControl) {
const date = todValue.value;
if (date ===null || date==='') return { requiredToDate: true };
}
static timeValidator(formGroupValues: FormGroup): any {
debugger;
console.log(formGroupValues);
const FromDate = formGroupValues.get('FromDate').value;
const ToDate = formGroupValues.get('ToDate').value;
const FromTime = formGroupValues.get('FromTime').value;
const ToTime = formGroupValues.get('ToTime').value;
if (FromDate.toString() === ToDate.toString()) {
let fromTime = [];
let toTime = [];
fromTime = FromTime.split(':');
toTime = ToTime.split(':');
if (parseInt(fromTime[0]) > parseInt(toTime[0])){
alert("condition satisfied not return any error message");
return { InValidToTime: true };
}
else if (
parseInt(fromTime[0]) === parseInt(toTime[0]) &&
parseInt(fromTime[1]) > parseInt(toTime[1])
){ alert("condition satisfied not return any error message")
return { InValidToTime: true };
}
}
}
}
' InValidToTime'
: удалите этот начальный пробел. Могут быть и другие проблемы, но на этом я перестал читать. - person JB Nizet   schedule 20.07.2018https://stackblitz.com/edit/angular-customvalidator?file=app%2Fdatepicker-overview-example.html
- person Mohamed Sahir   schedule 21.07.2018