将 two-dimensional 数组打印到 AngularJS 中的 table

Question

我有一个从控制器接收到的 two-dimensional 数组，我可以像这样在 html 中访问它：$ctrl.myTable。

所有 sub-arrays 的长度都相同，但 sub-arrays 的数量可以改变。

它有这种形式：

$ctrl.myTable = [[111, 222, 333, 444, ...],
                 [123, 234, 345, 456, ...],
                 ...
                ];

我想把它变成table。我设法放置了 table header（这是一个 one-dimensional 数组，与第一个的 sub-arrays 长度相同）但我不知道如何放置每个单独一行的值。

<div>

            <table class="table table-striped">
                <thead>
                    <tr>
                        <th ng-repeat="label in $ctrl.tableTitle">{{label}}</th>
                    </tr>
                </thead>
                <tbody>
                    <tr><td ng-repeat="label in $ctrl.tableTitle">{{$ctrl.myTable[0]}}</td></tr>                        
                </tbody>
            </table>

</div>

像这样，我只有第一个 sub-array 作为一行的第一个元素。

我的目标是这样：

name1 name2 name3 name4 
111     123   ...  ...
222     234   ...  ...
333     345   ...  ...
444     456   ...  ...
...     ...   ...  ...

你知道如何遍历数组以使其成为那样吗？

Answer 1

将您的 tbody 代码替换为：

<tbody>
    <tr ng-repeat="rows in $ctrl.myTable[0]">
        <td ng-repeat="label in $ctrl.tableTitle">{{$ctrl.myTable[$index][$parent.$index]}}</td>
    </tr>                        
</tbody>

将 two-dimensional 数组打印到 AngularJS 中的 table

Print a two-dimensional array into a table in AngularJS

html

arrays

html-table

angularjs

angular-ui-bootstrap