字段无效时不显示AngularJS验证消息答案

【问题标题】：AngularJS validation message is not displayed when the field is invalid字段无效时不显示AngularJS验证消息
【发布时间】：2015-02-27 05:14:18
【问题描述】：

我在我的 html 表单中使用 angularJs 验证。我在输入上使用了所需的验证，当我删除那里的值时，文本框以红色突出显示并尝试提交弹出错误“请填写此字段”但我的自定义错误消息未显示。以下是代码。

 <form id="settingsForm" ng-submit="vm.saveSettings()" class="form">
     <td style="width:30%">
          <input class="userInput" name="locationName" style="width:80%" type="text" maxlength="50" data-ng-model="vm.location.locationName" required />
          <label class="validationErrorText" data-ng-show="locationSettingsForm.locationName.$error.required">Location Name Required</label>
    </td>
 </form>

知道为什么会这样吗？附上未填写字段时的显示截图。

【问题讨论】：

标签： angularjs validation

【解决方案1】：

我创建了一个可以帮助你的 plunker。

http://plnkr.co/edit/GVAdjcjcYczmcmzoCqoF

<form role="form" name="signUpForm" class="form-horizontal">
 <div class="form-group">
    <label for="url" class="col-sm-4 control-label">URL</label>

    <div class="col-sm-8">
      <input type="text" class="form-control" name="url" id="url" placeholder="Enter last name"
             ng-model="user.lastName" required="true" ng-pattern="/(https?:\/\/)(www)?[A-Za-z0-9.\-@_~]+\.[A-Za-z]{2,}(:[0-9]{2,5})?(\/[A-Za-z0-9\/_\-.~?&=]*)*/">

      <span ng-show="signUpForm.url.$dirty && signUpForm.url.$error.required">
          <small class="text-danger">Please enter valid URL.</small>
      </span>
      <span ng-show="signUpForm.url.$dirty && signUpForm.url.$error.pattern">
          <small class="text-danger">URL should have 2 to 25 characters.</small>
      </span>
    </div>
  </div>
</form>

您可以使用类似的验证。 name 属性应与条件匹配。这里是url。

【讨论】：

【解决方案2】：

添加

name="locationSettingsForm"

到<form> 元素

【讨论】：

ohhh...我早先看到它真是太愚蠢了！我给出了 id 而不是 name。谢谢！