0

我在 AngularJS 中有一个 4 页的注册模块。我只想在最后提交详细信息。只有在用户填写了所有四个选项卡中的必填字段后,才会启用提交按钮。用户也可以在注册过程中保存数据,我们不需要任何强制性的字段验证

我正在为 4 个选项卡使用不同的控制器和模板,因为它需要大量数据作为输入。

我们如何识别用户在四个不同的控制器中填写了必填字段。

我在用

模块.值()

用于将用户数据保存为全局。通过这种方式,我可以在不同控制器之间共享用户详细信息。但我无法验证表单,因为它位于四个不同的控制器/选项卡中

serviceApp.value('UserData',{});
4

1 回答 1

1

当你写:

<form name="formName" ng-controller="TheCtrl" ...>

然后就会有一个变量名formNameTheCtrl. 它的类型将是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">
于 2013-10-01T09:55:10.000 回答