动态表单名称属性 在Angularjs中

Question

动态创建“ inputName”时，有人将如何使用formName.inputName。$ valid？

  <form name="formName">
    <input ng-repeat="(variable) in variables"
           type="text" name="variable.name"
           ng-model="variable.name" required />
 </form>

HTML输入属性“名称”的输出将是字符串“ variablename”，该字符串将应用于所有重复输入。

如果我们尝试这个

<form name="formName">
  <input ng-repeat="(variable) in variables"
         type="text" name="{{ variable.name }}"
         ng-model="variable.name" required />
</form>

HTML输入属性“名称”的输出将是字符串“ {{variable.name}}”，该字符串将应用于所有重复输入。

在这两种情况下，将不会动态创建每个重复输入元素的name属性；所有输入将共享相同的输入名称。如果您想基于特定名称调用特定输入，则效果不佳。

• 需要使用动态名称值
• 需要能够调用$ scope.formName.dynamicName。$ valid
• 需要能够调用$ scope.formName。$ valid
• 需要将动态名称输入字段添加到嵌套表单或主表单中

Answer 1

我找不到满足部分或全部这些需求的答案。这就是我想出的。

也许有更好的方法，所以请分享您的想法。
我正在使用Angularjs 1.3.0-beta.8

我有一个带有多嵌套指令的表单，这些指令都包含输入，选择等。这些元素都包含在ng-repeats和动态字符串值中。

这是使用伪指令的方法：

<form name="myFormName">
  <nested directives of many levels>
    ex: <input ng-repeat=(index, variable) in variables" type="text"
               my-name="{{ variable.name + '/' + 'myFormName' }}"
               ng-model="variable.name" required />
    ex: <select ng-model="variable.name" ng-options="label in label in {{ variable.options }}"
                my-name="{{ variable.name + '/' + 'myFormName' }}"
        </select>
</form>

注意：如果需要序列化输入表，则可以添加字符串索引并为该字符串索引。这就是我所做的。但是，动态名称输入意味着您可能不知道表单输入的名称，因此如何调用$
scope.formName。??????。您可以迭代$ scope.formName对象以获取与某个值匹配的键。这意味着像这样的字符串连接：

my-name="{{ dynamicString + hello + '/' + 'myFormName' }}"

然后，在$ scope.myFormName中，只需遍历对象并收集包含“ hello”的任何键，即可找到任何表单输入名称。

app.directive('myName', function(){

  var myNameError = "myName directive error: "

  return {
    restrict:'A', // Declares an Attributes Directive.
    require: 'ngModel', // ngModelController.

    link: function( scope, elem, attrs, ngModel ){
      if( !ngModel ){ return } // no ngModel exists for this element

      // check myName input for proper formatting ex. something/something
      checkInputFormat(attrs);

      var inputName = attrs.myName.match('^\\w+').pop(); // match upto '/'
      assignInputNameToInputModel(inputName, ngModel);

      var formName = attrs.myName.match('\\w+$').pop(); // match after '/'
      findForm(formName, ngModel, scope);
    } // end link
  } // end return

  function checkInputFormat(attrs){
    if( !/\w\/\w/.test(attrs.rsName )){
      throw myNameError + "Formatting should be \"inputName/formName\" but is " + attrs.rsName
    }
  }

  function assignInputNameToInputModel(inputName, ngModel){
    ngModel.$name = inputName
  }

  function addInputNameToForm(formName, ngModel, scope){
    scope[formName][ngModel.$name] = ngModel; return
  }

  function findForm(formName, ngModel, scope){
    if( !scope ){ // ran out of scope before finding scope[formName]
      throw myNameError + "<Form> element named " + formName + " could not be found."
    }

    if( formName in scope){ // found scope[formName]
      addInputNameToForm(formName, ngModel, scope)
      return
    }
    findForm(formName, ngModel, scope.$parent) // recursively search through $parent scopes
  }
});

这应该可以处理许多您不知道表单在哪里的情况。也许您有嵌套的表单，但是由于某种原因您想将此输入名称附加到两个表单上？好吧，只需传递您要附加输入名称的表单名称即可。

我想要的是一种将动态值分配给我永远不会知道的输入的方法，然后只需调用$ scope.myFormName。$ valid。

这可能是一个过大的杀伤力，并且1.3+中存在更好的解决方案。我当时找不到它。现在对我有用。

祝好运！希望这可以帮助某人!!!!