forms - Angular 2 : FormGroup: How to display custom error message

标签 forms angular

我正在使用 Angular4 构建前端。 如果用户提交了错误的表单,则应显示一条错误消息。

目前,我的错误处理是这样的:

// This code is run when a response from the server is received
if ('error' in server_response) {
    for (let key in server_response.error {
      this.form.controls[key].setErrors({'error': true});
      let error_message_from_server = server_response.error[key];
    }
}

我如何在 HTML 中显示错误:

<span class="error" *ngIf="field.invalid">Error: {{field.errors.error}} <br></span>

此时 field.invalid 在收到错误时变为真,但 field.errors.error 为空字符串。

问题:如何设置field.errors.error消息?此消息应该是 error_message_from_server

中的字符串

请注意,不能通过在 HTML 代码中使用 if 语句来解决此问题。潜在错误的数量有数百个。

最佳答案

this.form.controls[key].setErrors({'error': true});//key 是 error 值是 boolean 而不是 字符串

尝试设置一个字符串类型的值

for (let key in server_response.error {
  this.form.controls[key].setErrors({'error': erver_response.error[key]});
//Calling `setErrors` will also update the validity of the parent control.
}

关于forms - Angular 2 : FormGroup: How to display custom error message,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45615516/

相关文章:

Angular 路由自动重定向到默认路径

angular - 属性 'defaultColor' 在类型 'NgxMatDatetimePicker<D>' 中缺失,但在类型 'CanColor' 中需要

php - 如果 Codeigniter 表单中留空,如何保持值不变

javascript - 使用 Javascript 将自定义查询字符串变量拉入隐藏表单字段

javascript - 如何打印 JavaScript 值

Angular 2 : add hyphen after every 4 digit in input , 卡号输入

angular - 输入文件 onchange 事件未触发

html - 如何根据下拉列表中的选定数字生成表单输入字段(选择)

javascript - 创建你自己的输入版本[type=file]

javascript - 预览后 - 使用 AJAX 和 Fancybox 传递数据