ngForm

最新推荐文章于 2021-05-22 12:03:17 发布

weixin_30399055

最新推荐文章于 2021-05-22 12:03:17 发布

阅读量90

点赞数

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/yfann/p/4624734.html

本文介绍如何利用AngularJS中的ngForm指令结合ngRepeat来实现动态表单元素的验证功能，通过示例代码展示了如何为每个表单项设置错误提示，并确保在提交前所有必填项都已正确填写。

ngForm用于ng repeat隔离控件名

<form name="userForm" novalidate>

  <div class="form-group" ng-repeat="user in formData.users" ng-class="{ 'has-error' : userFieldForm.email.$invalid }">
  <ng-form name="userFieldForm">
    <label>{{ user.name }}'s Email</label>
    <input type="text" class="form-control" name="email" ng-model="user.email" required>
    <p class="help-block" ng-show="userFieldForm.email.$invalid">Valid Email Address Required</p>
  </ng-form>
  </div>

</form>

url:https://docs.angularjs.org/api/ng/directive/ngForm

转载于:https://www.cnblogs.com/yfann/p/4624734.html