"Required" 验证在具有默认值的 <select> 中不起作用

Question

我有一个必填的 <select> 字段：

<select name="service_id" class="Sitedropdown" style="width: 220px;" 
        ng-model="ServiceID" 
        ng-options="service.ServiceID as service.ServiceName for service in services"
        required> 
  <option value="">Select Service</option> 
</select>

当它为空时，表单应显示 "Select service" 错误消息。这是一个有效的 plunker.

当你故意选择空选项时，它工作正常。但是当你重新加载页面时，默认情况下 service_id 是空的并且没有验证。如何让AngularJS验证默认值？

Answer 1

验证检查仅在运行绑定到 ng-model 的值至少更改一次后，或当用户尝试提交表单时。如果不是这种情况，则在页面加载后，表单的所有必填字段都会立即显示错误，这将是一种非常不受欢迎的行为。

这就是为什么您只有在选择其他内容然后将其更改回空值时才会看到错误。

Answer 2

您的代码：

ng-show="myForm.service_id.$dirty && myForm.service_id.$invalid"

这意味着 - 如果值是脏的（已更改）并且无效。先删除，你会得到你想要的。

"Required" 验证在具有默认值的 <select> 中不起作用

"Required" validation doesn't work in <select> with default value

angularjs

angularjs-validation