我想定义4种不同的输出。在我的HTML中,我想说我想要显示多少列,然后在JavaScript中,如果有4列,我将运行此代码:
<div class="col-md-3">
<h1>Content</h1>
</div>
<div class="col-md-3">
<h1>Content</h1>
</div>
<div class="col-md-3">
<h1>Content</h1>
</div>
<div class="col-md-3">
<h1>Content</h1>
</div>
如果有3列,则运行此代码:
<div class="col-md-4">
<h1>Content</h1>
</div>
<div class="col-md-4">
<h1>Content</h1>
</div>
<div class="col-md-4">
<h1>Content</h1>
</div>
如果有2列,则运行此代码:
<div class="col-md-6">
<h1>Content</h1>
</div>
<div class="col-md-6">
<h1>Content</h1>
</div>
如果有1列,则运行此代码:
<div class="col-md-12">
<h1>Content</h1>
</div>
使用AngularJS有没有办法做到这一点?
答案 0 :(得分:3)
你可以试试这个:
NG:
$scope.number = 4;//your column count
$scope.getNumber = function(num) {
return new Array(num);
}
Html:
<div ng-repeat="i in getNumber(number) track by $index" class="col-sm-{{12/number}}">
<h1>Content</h1>
</div>