Angular 在 html 模板中显示来自反应式表单的错误消息

Question

是否可以在 html 模板中显示验证器错误消息我有这样的东西

this.formBuilder.group({
 sizeOfBuildingPart: [{ value: 0, disabled:false }, [Validators.min(0),Validators.max(100), Validators.required, Validators.pattern('[0-9]*$')]]});

在 html 模板中，如果最大值大于验证器，我需要显示错误消息

像这样

 {{formControls.sizeOfBuildingPart.errors?.max}}

它工作正常，但是否可以显示最大数值（在本例中为 100），尝试过类似的方法

{{formControls.sizeOfBuildingPart.errors?.max.value}}

但是不行，先谢谢了

Answer 1

您需要使用：(form.controls['sizeOfBuildingPart'].errors?.max?.max) 这将 return 您在验证中提供的最大数量。

这是它的工作演示： stackblitz

Angular 在 html 模板中显示来自反应式表单的错误消息

Angular display error message from reactive form in html template

reactive

angular