Question

我有一个包含许多表单输入的表单。所有表单输入都在指令中。

我有一些场景需要一个元素的状态来影响其他表单元素的属性，比如ng-required。

我很难弄清楚如何在其他表单元素中更新ng-required字段/ $ valid - 它们保持$ valid = false状态 - 我想动态更改ng-required值为假，因此不再需要它们，并且元素变得有效。

在plnkr下面的场景中，如果在第一个Title元素中键入文本，则不再需要第二个元素Title2，但它仍然是$ valid = false。

我尝试使用传递给指令的函数，如下所示，但它似乎没有更新表单元素的有效性......

Plnkr！ http://plnkr.co/edit/gCpB7dvBjiOisocjJNlz?p=preview

$scope.toggleRequired = function(content, contentFragment){
    if (contentFragment.name =='title' && angular.isDefined(contentFragment.value) && contentFragment.value.length){
      $scope.content.title2.required=false;      
      content.title2.required=false;      
    }else if (contentFragment.name =='title' && !angular.isDefined(contentFragment.value)){
      $scope.content.title2.required=true;      
      content.title2.required=true;      
    }
  }

Answer 1

ng-required实际上接受一个表达式，因此不需要在变量周围添加{{ .. }}，否则表达式将仅在编译时计算一次。

在textFormElement.html模板中，更改此行：

ng-required="{{contentFragment.required}}"

到此：

ng-required="contentFragment.required"

Plunker： http://plnkr.co/edit/YLInikMU5Dl2hIpHPauy?p=preview

希望这有帮助。

angular - 在指令中动态更改表单元素之间的验证要求

1 个答案: