使用ng-repeat在HTML中创建表

Question

我有string数组，我需要使用ng-repeat的{​​{1}}来显示它，如下面的屏幕截图所示：

我有一个想法，以及＃34;播放＆＃34;在index-s中显示：

AngularJS

对于每一行，我会显示第一项，并在每一行显示（$ index，$ index + 3，$ index + 6）

是否还有其他想法或想法如何做到这一点？

Answer 1

您可以这样做： http://jsfiddle.net/cmdm1dhL/1/

<div ng-controller="MyCtrl">
    <table>
        <tr ng-repeat="row in [] | range:Math.ceil(items.length/tableColumns)">
            <td ng-repeat="item in items | everyNth:row:Math.ceil(items.length/tableColumns)">{{item}}</td>
        </tr>
    </table>
</div>


<script type="text/javascript">
var myApp = angular.module('myApp',[]);

myApp.filter('range', function() {
    return function(input, total) {
        total = parseInt(total);
        for (var i=0; i<total; i++)
            input.push(i);
        return input;
    };
});

myApp.filter('everyNth', function() {
    return function(input, row, nth) {
        var output = [];
        for (var i=row; i<input.length; i+=nth)
            output.push(input[i]);
        return output;
    };
});

function MyCtrl($scope) {
    var numberOfItems = 14;
    $scope.items = [];
    for (var i=1; i<=numberOfItems; i++)
        $scope.items.push('Item ' + i);

    $scope.tableColumns = 3;

    $scope.Math = window.Math;
}

</script>