2017-03-02 50 views
-2

推我需要一個動態陣列輸出如下:動態文本框在陣列實施

tableNames = [ 
    ["string1", "string2"...], 
    ["string", "string"...] 
]; 

我需要從文本框中輸入的字符串的值和每個陣列應是動態的。 任何人都可以幫助我與AngularJS代碼設計,以獲得這樣的結構?

+0

**過寬**,你嘗試過這麼遠嗎? – Mistalis

+0

我嘗試使用ng-repeat並將值推入數組中。但我沒有得到預期的結果。 –

+0

分享您的執行代碼請致電 – Jax

回答

0

您的tableNames是數組的數組,它很難重複每個輸入。所以最好嘗試一下對象的數組。

<html> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<script type="text/javascript"> 
 
\t \t var app= \t angular.module("myApp",[]); 
 

 
\t \t app.controller("myCTRL",function($scope){ 
 
\t \t \t $scope.items= \t [{firstname:'ArunMozhi', lastname:'Varman'},{firstname:'Karikala', lastname:'Cholan'}]; 
 
     
 
     $scope.tableNames = [ 
 
    ["string1", "string2"], 
 
    ["string", "string"] 
 
]; 
 
$scope.add = function(){ 
 
$scope.items.unshift({firstname:'', lastname:''}); // you can use push   also 
 
} 
 

 
\t \t }); 
 
\t </script> 
 

 
<body ng-app="myApp" ng-controller="myCTRL"> 
 

 
<br><br> 
 
\t <div> 
 
\t \t <form name="addForm" novalidate> 
 
    <button ng-click="add()" ng-disabled="addForm.input.$invalid">Add</button> \t <br><br> 
 
    <div ng-repeat="item in items"> 
 
\t \t <input type="text" name="input" ng-model="item.firstname" ng-required="true"> 
 
    <input type="text" name="input" ng-model="item.lastname" ng-required="true"> 
 
\t \t <br><br> 
 
     </div>  
 
\t \t </form> 
 
\t \t 
 
\t </div> 
 
\t {{items}} 
 
    
 
    <br><br> 
 
    
 
    Your Result:- 
 
    
 
    <div ng-repeat="item in tableNames"> 
 
\t \t <form novalidate> 
 
    <input type="text" ng-model="item[0]"> 
 
    <input type="text" ng-model="item[1]"> 
 
\t \t \t <br><br> 
 
\t \t </form> 
 
\t \t 
 
\t </div> 
 
    {{tableNames}} 
 
</body> 
 
</html>

+0

您的回答很有幫助。我通過你的答案找到了答案。非常感謝 –

+0

我需要添加的東西是文本框是動態生成的,並將數組中的文本框的值推送出去。 –

+0

是的,你可以... –