Question

我目前有一个包含多个屏幕的表单，如果没有有效则无法提交。基本上，我想使用ng-if隐藏当前未使用的表单，但表单是空的，我无法根据必填字段设置有效性。我们正在使用angularJs 1.3.2。

我构建了一个自定义表单生成器指令。每个表单都只有一个蓝图，并使用该指令生成。所以主要表单设置如下（除了更多情况）：

<ng-form name="form">
  <fieldset ng-form="customerInfo">
    <div ng-if="activeTab === 'Customer Info'" ng-include="'customer-info.view.html'"></div>
  </fieldset>

  <fieldset ng-form="financialInfo">
    <div ng-if="activeTab === 'Financial Info'" ng-include="'financial-info.view.html'"></div>
  </fieldset>

  <div>
      <button type="submit" ng-disabled="form.$invalid" ng-click="onSubmit()">Save</button>
    </div>
  </div>
</ng-form>

如果我使用ng-if，则不会生成表单元素，因此不会检查其有效性。如果我使用ng-show，页面需要很长时间才能呈现。

我宁愿不必在JavaScript中设置有效性（因为我有许多模型，其中有很多条件使每个模型都有效）。

有谁知道处理这个问题的有效方法？

Answer 1

I Jurchfield，

我的建议未在独特视图中呈现所有表单。为了更好的方法，使用ng-form创建一个多步骤表单。这将允许您单独验证每个部分，而不必担心其他部分（从控制器集成路由和验证）。

在angularJs中验证用ng-if隐藏的多个表单？

1 个答案: