AngularJS動態表單字段驗證

Question

我正在嘗試驗證從后端端點給我的一些表單字段...

所以基本上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

Answer 1

試試我的自定義指令：

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>

DEMO

問題解釋：

默認情況下，輸入元素使用ngModelController（ ng-model ）調用FormController.$addControl當它們被鏈接到注冊本身並在FormController使用輸入的name屬性公開屬性，在這種情況下為{{ field.name }} 。 因此，即使注冊了控件但在FormController使用命名email firstName公開屬性，也只有{{ field.name }}引用最后一個輸入項

解決方案的解釋：

在此解決方案中，我創建了一個自定義指令，以便在運行時將{{ field.name }}替換為正確的名稱。

有關為什么我必須使用terminal:true,和priority:1000更多信息，請查看此討論： 在AngularJS中添加指令中的指令