採用NG-重複顯示在一個2元去

我需要創造這樣的事情採用NG-重複顯示在一個2元去

<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>

，但是，這是給同一values..in既..

來源

2016-08-24 Atul Sharma

我建議你在對2前手分割你的數組，然後只需使用2 NG-重複。一個用於排，另一個用於排。這使得它動態的任何情況 –

@AndrewDonovan是的..這將工作。或者，只是好奇知道..是否有可能在一個循環中顯示2個連續的元素ng-repeat ..？ –

如果包裝是。 Ng-repeat重複它所在的元素，以及其中的任何內容。但我相信你知道這一點。因此，打印2 *兄弟*元素是不可能的（具有相同的ng-重複） –

相反嘗試做一些黑客與角度，你可以使用Flexbox的：

* { 
 
    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>

它的優點是可以使響應式設計比使用角度的固定列數容易得多。

來源

2016-08-24 17:44:21 Christoph

非常感謝兄弟..雖然很好的做法..！我掙扎了2小時.. –

更新

<div class="row" ng-repeat="a in elem" ng-if="$even"> 
     <div class="col"> {{elem[$index - 1].name}} </div> 
     <div class="col"> {{a.name}} </div> 
    <div>

來源

2016-08-24 17:53:32 baskin

沒有.. 6只是例如..尺寸是未知的..我需要知道如何在一個循環中打印2個連續的元素.. –

這將不會工作，如果最後元素是奇數。 –

採用NG-重複顯示在一個2元去

回答

相關問題