角度定制验证-输入参数不变

时间:2018-09-17 21:46:04

标签: angular typescript angular-material

有两个日期输入:d1和d2。
要求d2必须大于或等于d1。

默认情况下,d2的最小日期是2018-09-03,该日期存储在 minDate 变量中。

[一个好例子]如果用户首先输入d1,
它将触发功能 onChange 并将 minDate 更新为d1的值。在这种情况下,如果用户要更新d2,则禁用 minDate 之前的所有日期。

[严重的情况]如果用户首先输入d2,
并在以后使用d1> d2输入d1时,我希望程序使用验证功能 settledateValidator 显示错误消息。 但是,传递给 settledateValidator minDate 不会更新(仍等于其默认值2018-09-03,而不是d1的值)。

我的问题:
1.为什么 minDate 在[不良情况]下无法更新?已在[一个好案例]中成功更新。
2.如何解决[一个坏情况]?

谢谢您的帮助!

.html中的

Too many open files

在.ts中:

<mat-form-field>
    <input matInput [matDatepicker]="picker_d1" placeholder="d1" [formControl]="d1" (dateChange)="onChange(d1)">
    <mat-datepicker-toggle matSuffix [for]="picker_d1"></mat-datepicker-toggle>
    <mat-datepicker #picker_d1 ></mat-datepicker>
</mat-form-field>

<mat-form-field>
    <input matInput [min]="minDate" [matDatepicker]="picker_d2" placeholder="d2" [formControl]="d2">
    <mat-datepicker-toggle matSuffix [for]="picker_d2" ></mat-datepicker-toggle>
    <mat-datepicker #picker_d2 > </mat-datepicker>
    <mat-hint *ngIf="!myform_fg.controls['d2'].valid"> d2 is smaller than d1 </mat-hint>
</mat-form-field>

1 个答案:

答案 0 :(得分:1)

您在构造函数中的初始化验证器中,给出了“ this.minDate”。当您更改此更改时,它只是参考,但验证器仍然具有旧的更改。

我遇到了这种情况,做您想做的事情的一种方法是将对对象的引用永不这样改变给您的验证器:

Fragments

对于更多示例,我个人通过传递formControl作为示例来做到这一点:(请参见minDateFromControl) https://github.com/xrobert35/asi-ngtools/blob/master/src/validators/asi-validators.ts

并使它像这样工作:

getActivity()