以角度验证具有动态给定名称的表单域

Question

我通过遍历具有不同问题的对象来向用户进行迭代，从而在视图中动态创建表单。每个问题的属性之一是formFieldName这是一个随机字符串，我用它来给每个表单字段一个不同的名称。

<form name="includedForm.newRequestForm" class="form-horizontal" role="form" novalidate>  

<div ng-if="message.question.attributes.structure.type == 'object'"> 
    <div ng-repeat="(index,objField) in message.question.attributes.structure.properties"> 
     <div ng-if="objField.type == 'array'" class="form-group" show-errors> 
      <label for="{{objField.formFieldName}}" class="control-label col-sm-6">{{objField.title}} 
       <br /><i><small>{{objField.description}}</small></i></label> 
      <div class="col-sm-6"> 
       <select class="form-control" name="{{objField.formFieldName}}" multiple ng-model="objField.userValue" ng-required="objField.required"> 
        <option ng-repeat="option in objField.items.enum" value="{{option}}">{{option}}</option> 
       </select> 
      </div> 
     </div> 

     <div ng-if="objField.type == 'boolean'" class="form-group" show-errors> 
      <label for="{{objField.formFieldName}}" class="control-label col-sm-6">{{objField.title}}</label> 
      <div class="col-sm-6"> 
       <input class="form-control" name="{{objField.formFieldName}}" ng-model="objField.userValue" type="checkbox" ng-value="option" ng-checked="message.question.attributes" /> 
      </div> 
     </div> 
    </div> 
</div> 

<div class="col-sm-12"> 
    <button ng-click="markAsDone(message)" class="btn btn-primary">Done</button> 
</div> 
<form> 

在控制器中，我能够获得formFieldName属性，但我无法弄清楚如何使用它来进行验证。

var MarkAsDone = function(message) { 

    $scope.includedForm = {}; 
    var formField = message.question.attributes.formFieldName; 
    if ($scope.includedForm.newRequestForm.{{formField}}.$valid){ 
     //submit the form 
    } 
} 

Answer 1

回答你的问题：

1. 第一，{{}}是=== $范围，所以你不使用HTML之外的任何地方。您在JS中使用$ scope，在HTML中使用{{}}创建一个管道（双向绑定），这样$ scope.variable.property就可以双向绑定到HTML中的{{variable.property}}。

   $scope.includeForm.email === {{ includeForm.email }} === ng-model="includeForm.email" === ng-bind="includeForm.email" 
   

   ，如果你设置的所有的人都设置这样，如果你设置$范围将在HTML，显然作为用户输入被捕获，它已经在$范围出现......所有连接的

2. 当试图从HTML获取值返回到JS你需要创建并设置一个$范围，所以如果你创建$ scope.dataModel.dataProperty并使用它在ng-model = dataModel.dataProperty（例子），你再次有两个方式绑定...你不需要做任何事情，因为角正在处理数据管道。所以，如果你要提取的值VAR，这可能是因为$范围已立即设定为用户检查框

   var formField = $scope.dataModel.dataProperty; 
   // but like I said no need as $scope.dataModel.dataProperty; is your var 
   

3. 在JS如果你想使用动态属性作为废物一个对象属性键，您可以将动态值放置在[]中

   $scope.variable[dynamicProperty].method; 
   // you can set a static property as a key with dot notation i.e. 
   $scope.variable.staticProperty = val; 
   

希望帮助