angular - 角度 2：只要 async-validator 仍在运行，就防止表单字段变为有效

Question

简短的事情：我有反应形式的输入字段，它们都由几个同步验证器（最小值，必需等）验证。

此外，我在表单本身上有一个去抖验证器。此验证器可能会将多个输入字段设置为无效。在这种情况下，输入字段在有效（绿色边框）和无效（红色边框）之间闪烁。

这种行为是由于同步验证器会将输入字段呈现为有效，但 250 毫秒后异步验证器将再次声明这些输入无效。

所以基本上我的每个密钥库都有闪烁的输入字段（只要我输入足够慢）

解决方案： ?

我需要的是让所有验证器在同一个滴答声中执行（在等待去抖动时间之后）。即使我同时单独对所有验证器进行去抖动，边框颜色也会有轻微的闪烁。

或者我可以让表单上的所有输入在 250 毫秒后去抖动，以便表单后面的所有验证器和模型只有在 250 毫秒的去抖动时间后才能获得信息。将 debouceTime(250= 应用于 valueChanges 并不能解决问题，因为 valdator 已经完成了他们的工作。

score 2 · Accepted Answer

使用[diabled]="!form.valid"而不是[disabled]="form.invalid"因为表单处于pending状态，因此不是无效的。

score 2 · Accepted Answer

我不确定这是否对你有用，但我用类似于使用 from.pending 状态的方法解决了我的问题。当您进行异步验证时，form._status 更改为“PENDING”，并且 form.pending = true，因此我禁用了我的输入，例如：

[disabled]="seedForm.invalid || seedForm.pending"

运行异步验证时避免 250 毫秒的 seedForm.invalid = false。

希望对你有效。

2 回答 2