Другие ответы:Двумерный массив в AngularJS
-
Оригинальный вопрос:
Как создать двухмерный массив в виде таблицы с ng-repeat?
this.boardArr = [
[1,6,3],
[5,2,7],
[9,10,11],
]
Это не работает:
<table class="game-board" ng-controller="GameBoardController as gameBoard">
<tr ng-repeat="row in boardArr">
<td ng-repeat="col in row">{{boardArr[row][col]}}</td>
</tr>
</table>
Вы должны создать таблицу в вашей точке зрения, как это:
<table class="game-board" ng-controller="GameBoardController as gameBoard">
<tr ng-repeat="row in boardArr">
<td ng-repeat="col in row">{{ col }}</td>
</tr>
</table>
Так ng-repeat Переберет boardArr, а затем вы можете отобразить значения в разных ячейках, как я делал выше. Вам не нужно получать доступ к значению, которое вы хотите отобразить следующим образом: boardArr[row][col], потому что col уже содержит значение boardArr[row][col].
Dont Repeat Yourself :) – Pumych
В чем проблема? – miquelarranz
Ну, я начал разрабатывать ответ, когда ваш вопрос не содержал никакого кода. У вас есть код, отредактированный выше. Надеюсь, это поможет вам. – miquelarranz
Вы должны были бы петлю над рядами, а затем их столбцы, как это:
<table>
<tr ng-repeat="row in $ctrl.boardArr">
<td ng-repeat="col in row>{{col}}</td>
</tr>
</table>
Э.Г. при использовании вложенных директив нг-повтора, как этот
var app = angular.module('app', []);
app.controller('myController', function ($scope) {
$scope.myArr = [
[1,6,3],
[5,2,7],
[9,10,11],
];
});<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app="app">
<div ng-controller="myController">
<table>
<tr>
<th>optional heading 1</th>
<th>optional heading 2</th>
<th>optional heading 3</th>
</tr>
<tr ng-repeat="subArr in myArr">
<td ng-repeat="val in subArr">{{ val }}</td>
</tr>
</table>
</div>
</body>
вы знакомы с контроллером вида-модели механизма в угловой? – AranS