javascript - 如何使用 Angular 验证来验证选择标签

Question

每当用户未在选择标记中选择任何值时，我想添加一条消息。到目前为止，我的处理方式如下:

    <form name="jdForm">
        <div class="form-group col-sm-6 require">
                                <label class="form-control-label">Jd Name</label>
                                <select class="form-control" name="jdname" ng-model="oData.jdDetails.jdName" required>
                                    <option>select</option>
                                    <option ng-repeat="jd in jdNames">{{jd}}</option>
                                </select>
                                <span ng-show="jdForm.jdname.$untouched ">Please select jd name</span>
                            </div>
<button ng-click="fnSave()">Publish</button>
</form>

这里的消息显示了我在 span 中给出的内容，但实际上是 onload 事件。它正在显示，但我需要在单击发布按钮后显示它。在验证表单之前，不应调用 ng-click 函数。

Answer 1

您需要保留提交按钮而不是简单的 ng-click 并在每个错误消息标签上应用条件是表单已提交，或者如果您想要显示错误，即使在聚焦时也添加一个条件是触摸。

下面是我更喜欢验证表单的例子

<span ng-messages="signupForm.password.$error" ng-if='signupForm.$submitted || signupForm.password.$touched'>
      <span ng-message="required" class="help-block">Please Enter password</span>
    </span>