如何使用延迟重复每行显示多个项目?

时间:2015-07-21 19:13:37

标签: onsen-ui

而不是像基础示例中那样将项目一个在一个以上 项目#1
项目#2
项目#3

我可以如下排列每行两列或三列中的项目?
项目#1项目#2项目#3
项目#4项目#5项目#6
项目#7项目#8项目#9

1 个答案:

答案 0 :(得分:1)

你可以通过ons-list内的ons-carousel来实现,这是一个例子:



<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>
&#13;
&#13;
&#13;