问AngularJS -在表单上动态添加输入，从单个提交的所有输入中收集数据

EN

var app = angular.module("app",[]);

/**
 * Created by Hadi on 7/28/2015.
 */

app.controller("MainController",['$scope','$http',function($scope,$http){

    $scope.formData = {
        info:[
            {
                name:"",
                family:"",
                phones:[
                    {
                       phone:"" 
                    }
                ]
            }
        ]
    };

    $scope.addItem = function(index){
        if($scope.formData.info[index+1] == null) {
            $scope.formData.info.push(
                {
                  name:"",
                  family:"",
                  phones:[
                    {
                       phone:"" 
                    }
                  ]
            });
        }
    };
  $scope.removeItem = function (index) {
        $scope.formData.info.splice(index, 1);
    };
    $scope.addPhone = function (index, index2) {
        var newphone = {
            phone:""
        };
        if ($scope.formData.info[index].phones[index2 + 1] == null)
            $scope.formData.info[index].phones.push(newphone);

    };
    $scope.removePhone = function (index1, index) {
        $scope.formData.info[index1].phones.splice(index, 1);
    };

   
}]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="MainController">
   <table border="1">
     <tr ng-repeat="item in formData.info track by $index">
        <td> <input type="button" ng-click="removeItem($index)" value="Delete Contact" ng-show="$index > 0"></td>
        <td> <input type="button" ng-click="addItem($index)" value="Add New Contact" ng-show="$last"></td>
        <td> <input type="text" ng-model="formData.info[$index].name"></td>
        <td><input type="text" ng-model="formData.info[$index].family"></td>
        <td > 
          <table>
          <tr ng-repeat="phone in formData.info[$index].phones">
            <td> <input type="text" ng-model="phone.phone"></td>
            <td> <input type="button" ng-click="addPhone($parent.$index,$index)" value="Add Phone" ng-show="$last"></td>
            <td> <input type="button" ng-click="removePhone($parent.$index,$index)" value="Delete Phone" ng-show="$last"></td>
            </tr>
          </table>
         
       </td>
       
        <td> <input type="button" ng-click="deleteRow($event,$index)" value="Delete Phone" ng-show="$index != 0"></td>
     </tr >
     
   </table> 
  <pre>{{formData | json}}</pre>
</div>

<tr ng-repeat="contact in ContactList"  >  
      <td>
            <input ng-model="contcact.firstName">
      </td>
      <td>
            <input ng-model="contcact.lastName">
      </td>
 </tr>

<!---click button--->
<button ng-click="AddContact()">

your controller ...

var myApp = angular.module('myApp',[]);

myApp.controller('Example', ['$scope', function($scope) {
$scope.ContactList = [{firstName: 'aaa' ,lastName:'bbb'}];
$scope.AddContact = function(){ var NewContact ={firstName: 'aaa' ,lastName:'bbb'} ;
$scope.ContactList.push();  
}
}]);