javascript - Angular Reactive forms从指令验证控件

Question

我有一个 Angular Reactive 表单中的数字输入，我有一个限制小数位数的指令，并且工作正常，我希望实现自动更正作为该指令的一部分，这也是一种工作但不是验证。

<input type="number" formControlName="TestPercentage" id="TestPercentage" max="100" step="0.25" numeric [decimals]="2"/>

ts文件

 this.form.addControl(formConstants.markupPercentage, new FormControl('', [Validators.min(0), Validators.max(100)]);

我正在使用https://gist.github.com/ahmeti/5ca97ec41f6a48ef699ee6606560d1f7中的十进制数指令以及我正在更改值的部分

if (Number(currentValue) > Number(this.el.nativeElement.max)) {
    this.el.nativeElement.value = parseFloat(this.el.nativeElement.max).toFixed(this.decimals);
    this.el.nativeElement.updateValueAndValidity();
  }

这是将值设为最大值但未删除无效类/未重新验证或指令中分配的新值未得到验证。

更改/更正元素值后如何触发验证？

标签： javascriptangularvalidationangular-reactive-forms

Answer 1

我解决此问题的方法是将抽象控件传递给指令并使用 setvalue 方法设置值，从而解决了该问题。