Angularjs - How to 'ng-repeat' a div for 'value in ng-model'-times?

Question

Using Angularjs, I want to create say 10 <div> if user inputs '10' in a text box.

<input type="text" id="gcols" placeholder="Number of Columns" ng-model="cols"/>

So whatever value user enters in this box, those many shall be created. So my generalized question is, how to 'ng-repeat' a <div> for 'ng-model' times?

UPDATE: Appreciating for all of your answers, I did something like following, by referring your answers. And that is working as of now, but tell me if any other logic is more efficient than this.

$scope.divs = new Array();

    $scope.create=function(){ //I added a button & invoked this function on its ng-click
            var a = $scope.cols;
            for(i=0;i<a;i++)
            {
                $scope.divs.push(a);
            }
            alert($scope.divs);
        };

Answer 1

You need to create an array to iterate on it. In your controller:

app.controller('ctrl', function ($scope) {
    $scope.cols = 0;
    $scope.arr = [];
    $scope.makeArray = function () {
        $scope.arr.length = 0;
        for (var i = 0; i < parseInt($scope.cols) ; i++) {
            $scope.arr.push(i);
        }
    }
});

In your view:

<div ng-controller="ctrl">
    <input ng-model="cols" type="text" ng-change="makeArray()" />
    <div ng-repeat="o in arr">hi</div>
</div>

JSFiddle