当你写:
<form name="formName" ng-controller="TheCtrl" ...>
然后就会有一个变量名formName
在TheCtrl
. 它的类型将是FormController。请注意表单对象具有$valid
和$invalid
属性。
在此表单下放置一个必填字段,例如:
<form name="formName" ng-controller="TheCtrl" ...>
<input name="myInput" ng-required ... />
$invalid=true
如果myInput
未填写,表单对象将具有。
以上介绍了解决方案的原理。您应该有 4 个表单和 4 个相应的控制器。每个控制器,如果定义如上,就知道其对应形式的有效性。共享服务(甚至是您的 中的一个字段model.value()
)将跟踪每个表单的有效性状态,例如:
app.controller("Form1Ctrl", function($scope, sharedService) {
$scope.$watch("form1Name.$valid", function(newval) {
sharedService.validity.form1 = newval;
});
...
});
只有当所有表单都有效时,才会启用最终提交按钮:
<button ng-disabled=" sharedService.validity.form1 == false
|| sharedService.validity.form2 == false
|| sharedService.validity.form3 == false
|| sharedService.validity.form4 == false">