如何在Angular组件中设置自定义消息

Question

我正在尝试发送自定义错误消息以显示在HTMl中。现在，我的组件看起来像这样：

 this.editForm.controls.name.setErrors({"incorrect": true});
 error.headers.get("errorMessageKey"); //this returns the custom message i want to display

我知道我们需要使用布尔值来切换HTML中的消息，但我不知道如何实现它。

我的HTML看起来像这样，但消息没有显示出来：

  <small class="form-text text-danger"                   
[hidden]="!editForm.controls.name?.errors?.incorrect"> {{name.incorrect}}
  </small> 

我的问题是，如何将消息和布尔值绑定在一起，以便消息可以在HTML中显示？

Answer 1

我个人会用这个：

<small class="form-text text-danger"[hidden]="editForm.get('name').valid"> {{name.incorrect}}

然后，当控件有效时，将隐藏消息。