angularjs创建动态表单元素

我有我的HTML元素像这样：angularjs创建动态表单元素

<body ng-controller="addController"> 
<div class="col-sm-10"> 

    <label class="control-label">tableName:</label> 
    <fieldset ng-repeat="tableName in tableNames"> 

     <input type="text" class="form-control" ng-model="tableName.tableName" /><br /> 
    </fieldset> 
    <button class="btn btn-default" ng-click="addNewTable()">Add tablename</button> 
    <input type="submit" ng-click="add()" />  
</div> 
<div> 
    <pre>{{tableNames|json}}</pre> 
</div> 
</body>

此代码生成一个文本框每次按钮被点击。

JS：

function addController($scope, $http) { 

     $scope.tableNames = []; 
     $scope.addNewTable = function (tableName) { 
      $scope.tableNames.push({}); 

     } 
}

当我显示表名它给了我：

[{"tableName":"textboxvalue"},{"tableName":"textboxvalue"}];

但我打算越来越的输出：

[{"tableName1":"textboxvalue","tableName2":"textboxvalue","tableName3":"textboxvalue"}];

我应该有改变在设计中以获得期望的输出。在此先感谢。

来源

2017-03-01 swaroop sg

尝试设置'NG-模型= “表名[ '表名' +（$索引+ 1）]”'对于输入元件 –

您每次都将对象推送到数组，但是您想要的是在数组中的对象中添加键值对。尝试此

$scope.tableNames = [{}]; 
    $scope.addNewTable = function (tableName) { 
     $scope.tableNames[0].tableName = "textboxvalue" ; 

    }

来源

2017-03-01 04:35:01 Jazib

angularjs创建动态表单元素

回答

相关问题