AngularJS ui路由器表单提交

Question

我正在使用AngularJS + ui路由器来制作一些具有嵌套窗体和路由的向导。

这里是主要形式：

<div id="form-container-wizard"> 
     <div class="form-horizontal" role="form"> 
      <form name="addItem_form" ng-submit="submitForm()"> 


       <div class="page-header text-center"> 
        <h2>Post Your Item</h2> 

        <!-- the links to our nested states using relative paths --> 
        <!-- add the active class if the state matches our ui-sref --> 
        <div id="status-buttons-wizard" class="text-center"> 
         <a ng-class="{ disabled: ItemCheckPass }" ui-sref-active="active" ui-sref=".item"> <span></span>Item</a> 
         <a ng-class="{ disabled: !ItemCheckPass || LocationCheckPass}" ui-sref-active="active" ui-sref=".location"><span></span>Location</a> 
         <a ng-class="{ disabled: !ItemCheckPass || !LocationCheckPass || AccountCheckPass}"ng-show="!IsAuthenticated" ui-sref-active="active" ui-sref=".account"><span></span>Account</a> 
         <a ng-class="{ disabled: !ItemCheckPass || !LocationCheckPass || !IsAuthenticated && !AccountCheckPass }"ui-sref-active="active" ui-sref=".social"><span></span>Social</a> 
        </div> 
       </div> 

       <div class="panel panel-default"> 
        <div id="form-views" ui-view></div> 
       </div> 

      </form> 
     </div> 
    </div> <!-- wizard container --> 

这里是窗体的路由：

.state('post_add', { 
     url: '/post_add', 
     templateUrl: '/view/post_wizard/form.html', 
     controller: 'postWizardMainController', 
     abstract:true 
    }) 
    .state('post_add.item', { 
     url: '', 
     templateUrl: '/view/post_wizard/form-item.html', 
     controller: 'postWizardController' 
    }) 
    .state('post_add.location', { 
     url: '/location', 
     templateUrl: '/view/post_wizard/form-location.html', 
     controller: 'postWizardController' 
    }) 
    .state('post_add.account', { 
     url: '/account', 
     templateUrl: '/view/post_wizard/form-account.html', 
     controller: 'postWizardController' 
    }) 
    .state('post_add.social', { 
     url: '/social', 
     templateUrl: '/view/post_wizard/form-social.html', 
     controller: 'postWizardController' 
    }); 

每个视图包含部分形式，并通过使用存储的形式的元素的值来$scope.AddItem对象纳克 - 类似<input type="email" class="form-control" name="email" ng-model="AddItem.email" ng-minlength=3 ng-maxlength=30 required>

postWizardMainController用于保持验证变量和方法。

所以，问题是：

选项1：代码为这里列出，<form name="addItem_form" ng-submit="submitForm()">是没有得到提交由位于最后的形式观点<input type="submit" ng-disabled="addItem_form.$invalid" class="btn btn-orange" value="Post An Ad">。

选项2：在过去的形式我把submitForm()到NG-点击，并在postWizardMainController定位submitForm()功能。在这个选项中，submitForm()函数被调用，没有对象被传入。 $scope.AddItem是undefined。

所以，问题是： 如何提交表单，并通过$scope.AddItem对象就范，其中必须包含所有的嵌套表格中的数据。

Answer 1

的解决方案是申报$scope.AddItem = {}在postWizardMainController