我有多个开始和结束日期输入字段。我找不到验证它们的方法。我试图验证它们,但无法获得相关输出。
这是stackblitz网址:https://stackblitz.com/edit/angular-yhbuqn-wpbwjw
我在这里有几个目标:
1)需要设置我在ts文件中提到的默认日期。那里 是我尝试设置默认值的注释代码。
2)如果结束日期大于开始日期,则不会显示错误消息。您可以看到一个红色边框正在应用,但未显示消息。
3)我无法设置第二组开始和结束日期输入字段的值。
我有多个开始和结束日期输入字段。我找不到验证它们的方法。我试图验证它们,但无法获得相关输出。
这是stackblitz网址:https://stackblitz.com/edit/angular-yhbuqn-wpbwjw
我在这里有几个目标:
1)需要设置我在ts文件中提到的默认日期。那里 是我尝试设置默认值的注释代码。
2)如果结束日期大于开始日期,则不会显示错误消息。您可以看到一个红色边框正在应用,但未显示消息。
3)我无法设置第二组开始和结束日期输入字段的值。
对于第一部分,要设置日期,请尝试以下操作:
ngOnInit() {
this.myForm = this.formBuilder.group({
users: this.formBuilder.array([
this.formBuilder.group(
{
startDate: [this.startDate],endDate: [this.endDate]
},{ validator: this.checkDates }
)
])
});
}
对于第二部分,请尝试以下操作:
这样,您必须手动触摸输入,也可以尝试使用this.myForm.markAllAsTouched();
<mat-error *ngIf="myForm.controls['users'].controls[$index].controls['endDate'].touched && myForm.controls['users'].controls[$index].invalid">
End date cannot be earlier than start date
</mat-error>
或
<mat-error *ngIf="myForm.controls['users'].controls[$index].controls['endDate'].value != null && myForm.controls['users'].controls[$index].invalid ">
End date cannot be earlier than start date
</mat-error>