Angularjs表单验证，基于服务响应显示错误消息答案

【问题标题】：Angularjs form validation, based on serve response show error msgAngularjs表单验证，基于服务响应显示错误消息
【发布时间】：2016-09-22 19:30:34
【问题描述】：

我有一个表格，用于检查电子邮件是否已经存在。如果它已经存在，我将显示来自 json 响应的错误消息。这部分已经完成（这是我在用户点击提交按钮时检查）。

如果电子邮件已经存在，我会收到 409 错误。

我需要更新电子邮件输入归档。需要添加一个 msg 该电子邮件已经存在。我正在使用 ng-show="personalInfo.$submitted"

<form name="personalInfo" role="form" autocomplete="off">
<div class="form-group">
    <input type="text" maxlength="11" class="form-control" name="usupiEmail" ng-model="usuAttributes.personalInfo.email" ng-focus="ShowPlaceholder('email')" />
    <label>Email ID</label>

    <div class="error-message" ng-show="personalInfo.$submitted" ng-cloak>
        Please verify your Email.
    </div>
</div>
<button type="submit" class="btn-default" ng-click="usupiUpdateUser()">Next</button>

我也尝试过不同的方法：

function checkWrongEmail (errorCode) {
    if (errorCode === '409') {
        return true;
    }
    return false;
}

【问题讨论】：

你如何更新personalInfo.$submitted（顺便说一句，你可能误用了它，应该是usuAttributes.personalInfo.$submitted？当你从服务器收到409错误的响应时，你可以使用 true 值更新此属性。这样，它将显示该错误的预期消息。

标签： javascript angularjs

【解决方案1】：

首先将 ng-app 指令添加到封闭的 div 中。没有它是行不通的。我尝试手动输入真/假，直到设置了 ng-app 才起作用。见JSFiddle。如果您从表单元素中删除 ng-app，它将无法正常工作。而通过将 ng-show 更改为 true/false 的指令将给出所需的结果。

您指定的 ng-model 是：

usuAttributes.personalInfo.email

但是ng-show中的表达式是：

personalInfo.$submitted

您应该检查这是否在模型的范围内还要检查您在立即关闭的输入元素上定义模型这一事实是否不会导致访问变量时出现问题（同样，错误消息 div 是否可以访问它？）

【讨论】：