Angular.js：表單上的$ setDirty（）不會傳播給子表單元素

Question

我有一個表單，我正在驗證Angular.js，並且我想實際地在表單的子元素上設置髒狀態。但是，子元素在指令中處於隔離範圍內。我怎樣才能將輸入元素設置爲來自父範圍的ng-dirty？

示例代碼：

<form name="parentForm"> 

    <!-- How can I validate an input element inside this directive--> 
    <childDirective required /> 

</form> 

例兒童指令：

<div> 
    <input type="text" ng-form name="childForm" required/> 
</div> 

Answer 1

找到了解決方案：

$scope.parentForm.$error; // type {array} 

這是是兒童與母體形式形式元素的數組，所以對於我的問題，我使用以下命令將僞指令中的子元素設置爲髒：

$scope.parentForm.$error.required[0].$setDirty(); 

Answer 2

我在Typescript中做了一個實用方法，以更全面的方式處理這個問題。對於任何深度的錯誤，這都可以$ setDirty。我知道你問的是你的問題中的特定領域，但對於某些你可能正在解決的問題，這可能是一個更有用的工具。

class AngularFormUtil 
{ 
    static RecursiveSetDirty(form: ng.IFormController) 
    { 
     form.$setDirty(); 
     for (let errorProp in form.$error) 
     { 
      if (!form.$error.hasOwnProperty(errorProp)) 
       return; 

      for (let error of form.$error[errorProp]) 
      { 
       if (error.$setDirty) { 
        AngularFormUtil.RecursiveSetDirty(error); 
       } 
      } 
     } 
    } 
} 

只要插上形式：

AngularFormUtil.RecursiveSetDirty($scope.parentForm); 

平原JS編譯版本：

var AngularFormUtil = (function() { 
    function AngularFormUtil() { 
    } 
    AngularFormUtil.RecursiveSetDirty = function (form) { 
     form.$setDirty(); 
     for (var errorProp in form.$error) { 
      if (!form.$error.hasOwnProperty(errorProp)) 
       return; 
      for (var _i = 0, _a = form.$error[errorProp]; _i < _a.length; _i++) { 
       var error = _a[_i]; 
       if (error.$setDirty) { 
        AngularFormUtil.RecursiveSetDirty(error); 
       } 
      } 
     } 
    }; 
    return AngularFormUtil; 
}());