使用angularjs ng-model创建9x9网格

creation of 9x9 grid using angularjs ng-model

本文关键字：9x9 网格 创建 ng-model angularjs 使用      更新时间：2023-09-26

我尝试在angularjs中使用ng-model在ng-repeat中创建9x9表。但是网格/表创建，我不能从ng-model得到确切的值。

html代码:

<tab ng-repeat="t in tabs">
<table>
<tr ng-repeat="p in planets track by $index" >
<td ng-repeat="pl in planets track by $index" >
<input type="text" class="form-control" placeholder="{{planets.pname}}" ng-model="t.planets.pname">
</td>
</tr>
</table>
</tab>

js代码:

  $scope.planets = [
    {'pname':'Kethu','tamil':'கேது'},
    {'pname':'Sukran','tamil':'சுக்ரன்'},
    {'pname':'Suriyan','tamil':'சூரியன்'},
    {'pname':'Santiran','tamil':'சந்திரன்'},
    {'pname':'Sevai','tamil':'செவ்வாய்'},
    {'pname':'Raagu','tamil':'ராகு'},
    {'pname':'Guru','tamil':'குரு'},
    {'pname':'Sani','tamil':'சனி'},
    {'pname':'Puthan','tamil':'புதன்'}
];

My Expected output in ng-model:

tabs=[{"tabname":"T1","kethu":["kethu":0,"sukran":"5",...],"sukran":["kethu":2,"sukran":6,...]....},{"tabname":"T2",...}]

你应该把

<input type="text" class="form-control" placeholder="{{pl.pname}}" ng-model="pl.pname">

这是另一种形式的基本编程。

在嵌套的for循环中，如果你想访问(读/写)一个元素，你需要通过两个循环的枚举数来锁定它

for (i=0; i<row.length; i++){
  for (j=0; j<column.length; j++){
    data[i][j] = something
  }
}

ng-repeat 

<div ng-repeat="(i, rowData) in row">
  <div ng-repeat="(j, columnData) in column">
    {{rowData.name}}, {{columnData.name}} <input ng-model="data[i][j]">
  </div>
</div>
相关文章：