AngularJS 中的条件验证

Question

如果满足某些条件，我需要对表单字段进行验证。假设我的表单如下：

<div ng-controller="MyController">
 <form name="myForm">
  <div>
   <div class="" ng-class="{error: myForm.gender.$invalid}">
    Gender:
   </div>
   Male   <input type="radio" name="gender" value="M" ng-model="survey.gender"   required/> 
   Female <input type="radio" name="gender" value="F" ng-model="survey.gender" required/> 
  </div>

  <div ng-show="survey.gender == 'F'">
   <div class="">
    Are you pregnant?
   </div>
   Yes <input type="radio" name="pregnant" value="Y" ng-model="survey.pregnant"/>
   No  <input type="radio" name="pregnant" value="N" ng-model="survey.pregnant"/>
  </div>
 </form>
</div>

如果用户选择女性性别，我希望怀孕问题成为必填项。Angular是否提供了这种验证方式？

- jacoviza

---

小心，我刚刚在阅读有关纽约的一场监护权争夺战，其中父亲曾经怀孕并抱着婴儿。谈论一个边缘情况！或者说是圆润的，我想... - Ben

你可以查看我的详细答案。 https://dev59.com/3FcO5IYBdhLWcg3woC9T#63097025 - Majedur

Answer 1

其实我找到了能够实现这个功能的指令，我只需要添加 ng-required="survey.gender == 'F'" 即可。

现在代码看起来会是这样的：

<div ng-controller="MyController">
 <form name="myForm">
  <div>
   <div class="" ng-class="{error: myForm.gender.$invalid}">
    Gender:
   </div>
   Male   <input type="radio" name="gender" value="M" ng-model="survey.gender" required/> 
   Female <input type="radio" name="gender" value="F" ng-model="survey.gender" required/> 
  </div>

  <div ng-show="survey.gender == 'F'">
   <div class="">
    Are you pregnant?
   </div>
   Yes <input type="radio" name="pregnant" value="Y" ng-model="survey.pregnant" ng-required="survey.gender == 'F'">
   No  <input type="radio" name="pregnant" value="N" ng-model="survey.pregnant" ng-required="survey.gender == 'F'">
  </div>
 </form>
</div>

- jacoviza

---

嗨@jacoviza，我正在尝试执行与此类似的实现，有两个按钮（保存和提交），在点击提交时需要对文本框进行必填字段验证，而不是在点击保存时。你能分享一些想法吗？ - Manveer Singh

Answer 2

是的，请查看ng-required。文档不是很好，但链接中有一些内容。

此外，这里还有一个类似于您的问题的问题，它是在较早的日期提出的。

- hunt