How to use lazy repeat to display more than one item per line?

Question

Instead of referring to elements one above one, as in the basic example Point # 1
Point # 2
Point # 3

What can I arrange the elements in two or three columns per row, as shown below?
Item # 1 Item # 2 Item # 3
Item # 4 Item # 5 Item # 6
Item # 7 Item # 8 Item # 9

Answer 1

You can do this with puttin ons-listinside ons-carousel, here is an example:

<ons-page>
  <ons-carousel swipeable overscrollable auto-scroll style="height: 100%; width: 100%;">
    <ons-carousel-item ng-repeat="i in [0,1]">
      <ons-list>  
        <ons-list-item ng-repeat="j in [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20]">
          Item #{{ j + i * 21 }}
        </ons-list-item>
      </ons-list>
    </ons-carousel-item>
  </ons-carousel-item>
</ons-page>

Run code