我需要创建这样的东西
<div class="row">
<div class="col">
<div class="col">
<div>
现在我的数组有 6 个元素.. 所以,我需要创建这样的东西。
<div class="row">
<div class="col"> 1 </div>
<div class="col"> 2 </div>
<div>
<div class="row">
<div class="col"> 3 </div>
<div class="col"> 4 </div>
<div>
<div class="row">
<div class="col"> 5 </div>
<div class="col"> 6 </div>
<div>
我不知道该怎么做.. 我试过的..
<div class="row" ng-repeat="a in elem">
<div class="col"> {{a.name}} </div>
<div class="col"> {{a.name}} </div>
<div>
但是,这给出了相同的值..在两个..
最佳答案
你可以使用 flexbox,而不是试图用 Angular 做一些 hack:
* {
box-sizing: border-box;
}
.row {
display: flex;
flex-wrap: wrap;
}
.col {
width: 50%;
height: 40px;
padding: 8px;
}
<div class="row">
<div class="col">Col 1</div>
<div class="col">Col 2</div>
<div class="col">Col 3</div>
<div class="col">Col 4</div>
<div class="col">Col 5</div>
<div class="col">Col 6</div>
</div>
它的优势在于,与固定数量的带 Angular 列相比,您可以更轻松地进行响应式设计。
关于javascript - 使用 ng-repeat 一次显示 2 个元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39129760/