AngularJS验证引用具有变量名称的表单对象

Question

假设我有一个简单的表单，其中包含一些 Angular 验证：

<form name="myForm">
    <input name="{{myField}}" 
            type="text" 
            ng-model="obj.myField" 
            required />
    <div class="text-danger" ng-show="myForm[myField].$invalid">
        <div ng-show="myForm[myField].$error.required">
            Field is required.
        </div>
    </div>
</form>

现在假设我想使用变量作为表单名称，而不是硬编码的字符串：

<form name="{{formName}}">

如何修改myForm[myField].$invalid和myForm[myField].$error.required以仍引用我的表单？

Answer 1

从当前角度开始，您不能动态命名表单输入元素。如果你对一个表单集合执行此操作，你可以使用 ng-form 指令并执行以下操作（在 jade 语法中）：

div(ng-repeat = "user in users", class="form-group")
    ng-form(name="userFieldForm")
      input(type="text", required, ng-model="user.email", name="email")
      p(class="help-block" ng-show="userFieldForm.email.$invalid">Valid Email Address required