Javascript “html选择必需”的AngularJS指令

又是一天，又是一个问题。我正在重新开发我的web应用程序。现在我遇到了一个问题。主要浏览器不支持“必需”属性 ，它仅在第一个选项值为空时才起作用。很好，如果表单是$invalid，并且它是由CLEASE select留下的，那么提交事件将不会执行任何操作

})

出于兼容性的考虑，我进行了HTML5验证，HTML5验证只显示了第一个提示。 它应该是输入字段的“required”属性，并且以相同的方式工作，我不想禁用我的提交按钮。也许我也可以删除此选项，请选择并将其保留为空。 或者也许我不够聪明，不能做同样的事情，比如：

不管我们是检查值还是选择的索引，不管什么

谢谢你的帮助和问候

---

炭疽病

AngularJs已经知道如何处理所需的属性请参见。在您的情况下，您可能希望执行类似的操作：

<form name="myForm">
  <select name="country" 
        ng-model="country" 
        ng-options="c.name for c in countries" 
        required>
    <option value="">-- chose country --</option>
  </select>
</form>

然后，当您的表单和/或选择被Angular标记为无效时，或者单击submit按钮后，您将看到一条错误消息

// Inline validation appears directly when select value is empty
<span class="error" ng-show="myForm.country.$error.required">Required!</span>

// Or after a click on submit, assuming you have set a boolean to show/hide error
<span class="error" ng-show="validationFailed">Required!</span>

---

我已经用这两种可能性组合了一个工作示例。

重点是，我不想使用ng选项，因为我还选择了具有两个硬编码值的选项。尽管我需要将我的国家/地区从xml中保存到一个变量中，但是如何进行^^^ ng选项中的任何内容都将从Angular的双向数据绑定中受益。这意味着您可以从一个空数组开始，然后用来自服务器的数据填充它。为了演示这一点，我修改了plunker并添加了一个addcountry功能。这与您在接收数据时需要执行的操作大致相同。希望这有帮助。

<span class="error" data-ng-show="requestForm.place.hasVisited &&   requestForm.place.$invalid">Required!</span>

<form name="myForm">
  <select name="country" 
        ng-model="country" 
        ng-options="c.name for c in countries" 
        required>
    <option value="">-- chose country --</option>
  </select>
</form>

// Inline validation appears directly when select value is empty
<span class="error" ng-show="myForm.country.$error.required">Required!</span>

// Or after a click on submit, assuming you have set a boolean to show/hide error
<span class="error" ng-show="validationFailed">Required!</span>