AngularJS动态表单字段验证

  • Z时代
  • 2024-01-10
  • 分类：问答

我正在尝试验证从后端端点给我的一些表单字段…

因此基本上，input元素是在内动态创建的ng-repeat。因此，input属性也被动态添加，如type，name等…

但是，由于该name属性是动态添加的，因此当我尝试验证它时，例如：

myForm.elName.$valid

它不返回任何内容，因为在这一点上，它不知道是什么elName。

我创建了一个jsFiddle来演示该问题：http :

//jsfiddle.net/peduarte/HB7LU/1889/

任何帮助或建议将不胜感激！

FANX。

我一直在参考此AWESOME文档：http

://docs.angularjs.org/api/ng.directive:

input.email

回答：

试试我的自定义指令：

myApp.directive("dynamicName",function($compile){
  return {
      restrict:"A",
      terminal:true,
      priority:1000,
      link:function(scope,element,attrs){
          element.attr('name', scope.$eval(attrs.dynamicName));
          element.removeAttr("dynamic-name");
          $compile(element)(scope);
      }
   };
});

用它：

<input dynamic-name="field.name"
       type="{{ field.type }}"
       placeholder="{{ field.name }}"
       ng-model="field.value"
       required>

演示

默认情况下，输入元件使用ngModelController（ ng-model）调用FormController.$addControl时它们与注册其自身，并在暴露的属性FormController与

是{{ field.name}}在这种情况下。因此，即使控制已注册，但你没有暴露在性能FormController与命名的email，firstName你只需要{{

field.name }}引用

在此解决方案中，我创建了一个自定义指令，以{{ field.name }}在运行时将替换为正确的名称。

有关为什么我必须使用terminal:true,and的更多信息priority:1000。

以上是 AngularJS动态表单字段验证 的全部内容， 来源链接： utcz.com/qa/416064.html

回到顶部