Я пытаюсь создать случайные div div (.childBox) из twitter bootstrap, используя AngularJS.
<div ng-controller="HomeCtrl">
<div class="motherBox" ng-repeat="n in news">
<div class="childBox" class="col-md-{{boxSpan}} box">
<a href="#" class="thumbnail">
<img src="{{holderLink}}" height="200px" alt="100x100">
<p class="tBlock"> {{n.title}} </p>
</a>
</div>
</div>
</div>
controller('HomeCtrl', ['$scope', '$http', function($scope,$http) {
$http.get('news/abc.json').success(function(data) {
$scope.news = data;
});
$scope.holderSize = 150;
$scope.holderLink = 'http://placehold.it/'+$scope.holderSize+'x'+$scope.holderSize;
$scope.boxSpan = getRandomSpan();
function getRandomSpan(){
return Math.floor((Math.random()*6)+1);
};
}])
Я хочу создать другое целочисленное значение для boxSpan для каждого .childBox div, но все .childBox имеют одинаковое значение boxSpan. Хотя каждый раз, когда я обновляю страницу boxSpan, создается случайное значение.
Как я могу генерировать разные/случайные значения для каждой итерации ng-repeat?