如何在 angularjs 中构建多步表单？答案

【问题标题】：How can I build multi-step form in angualrjs?如何在 angularjs 中构建多步表单？
【发布时间】：2014-03-20 09:27:38
【问题描述】：

我的模板中有以下代码，我使用 ng-include 加载我的表单。表单有 1 个字段，用户可以在其中输入数字。当用户提交时，我想加载另一个表单来替换当前表单并显示用户输入的文本字段的数量。在我的控制器中，我正在获取下一个表单的 html，但我仍然显示当前表单。我不知道这是否是正确的方法。

<div class="row text-center white">
<div class="col-md-4  col-md-offset-4">
    <h2>Welcome</h2>        
    <div class="slide-animate" ng-include="'template_1'"></div>
</div>

【问题讨论】：

标签： javascript forms angularjs

【解决方案1】：

Juste 有一个控制器 + 一个模板。每完成一个步骤，将步骤数据保存在 sessionStorage 或非持久化服务中，并通过转到下一个控制器显示下一步。

在您的步骤结束时，您将所有步骤数据发送到服务器.. 不要忘记在正确的时间清理存储的数据，以防止显示永远最后输入的值。

很简单

【讨论】：

"通过更改应用路由显示下一步"。你到底是什么意思？
只是一个基本的下一步，以便转到下一个控制器（步骤）。已编辑帖子。
好的。知道了。这现在有效。但问题是渲染整个视图的路线力。如果您在上面看到我的代码，那么除了 ng-include 之外，我希望所有页面上的其余代码都可用。所以，我只想用新形式替换 ng-include div。
“我想要所有页面上的其余代码”你能澄清一下吗？如果您存储数据并转到上一步，您将能够按原样检索/构建视图。另一种选择是将所有步骤放在一个视图中，然后根据您的要求 ng-show ng-hide 权限步骤
对不起，如果您误解了。我只想改变形式。这就是我使用 ng-include 的原因。页眉和页脚等其他元素应该相同。当路线改变时，整个视图都会改变。在这种情况下，我必须在我的新路由模板中包含页眉和页脚。如果有不改变路线的解决方案，我会很好。