Question

我有使用ui.router的多步AngularJs表单，请参见下面的内容：

signup.config(function($stateProvider, $urlRouterProvider,$locationProvider) {

  $stateProvider

    // route to show our basic form (/form)
    .state('signup', {
        url: '/signup',
        templateUrl: './stepOne.ejs',
        controller: 'login'
    })

    // nested states 
    // each of these sections will have their own view
    .state('signup.form', {
        url: '/form',
        templateUrl: './stepTwo.ejs'

    })

    .state('signup.interests', {
        url: '/interests',
        templateUrl: './stepThree.ejs'
    })

     $urlRouterProvider.otherwise('/signup/form');
});

尽管如此，表单有多个步骤才能提交。每个步骤都有自己的观点。

最初我只有一个页面表单，我正在将表单提交给我的API，如下所示：

<form name="myForm" action="/signup" method="POST">

上述内容适用于单页表单但，这不适用于多步骤表单。

原因我认为，当点击表单最后一步的提交按钮时，提交按钮无法访问上一个表单步骤/页面中的用户输入。并且服务器/ API需要POST请求中的所有用户输入，因此它被拒绝。

所以我的问题是如何使用<form action="/signup" method="POST">

提交AngularJS多步骤（ui.router）表单

我已经尝试通过Angular $ http POST函数发布表单，但这不允许我使用passport.js重定向服务器端的用户。您可以在我的SO question

上查看有关该问题的详细信息

任何帮助将不胜感激。

Answer 1

这个逻辑是完全错误的，如果你想在UI中使用多步形式，你不应该使用路由，因为一个移动到下一个表单（下一个url），那个旧的将从DOM中移除，所以你可以'保留已输入的值。

在这种情况下，你可以简单地使用ng-if / ng-show / ng-hide方法继续下一步。

一切顺利...... !!!如果你喜欢投票

AngularJS多步形式（ui.router）提交

1 个答案: