AngularJS Example

HTML

<div ng-app="app">
    <div ng-controller="MainController">
        <div class="row" data-ng-repeat="row in rows">
           <div class="col" data-ng-repeat="col in cols">
               {{objects[$parent.$index * numColumns + $index].entry}}
            </div>
        </div>   
        <a data-ng-click="addMore()">Add More</a>
    </div>
</div>

CSS

div.row{
    
}
div.row > div.col{
 width:100px;
display:inline-block;    
}

JavaScript

angular.module('app', []);

function MainController($scope){
    $scope.objects = [
        {entry: 'a'},
        {entry: 'b'},
        {entry: 'c'},
        {entry: 'd'},
        {entry: 'e'},
        {entry: 'f'},
        {entry: 'g'},
        {entry: 'h'}    
    ];
    $scope.numColumns = 3;  
    $scope.rows = [];    
    $scope.cols = [];    
    $scope.$watch("objects.length", function(){
        $scope.rows.length = Math.ceil($scope.objects.length / $scope.numColumns);
        $scope.cols.length = $scope.numColumns;        
    });
    
    $scope.addMore = function(){
        $scope.objects.push({entry: (new Date()).getTime });
    };
}