html - Ionic - 如何将 ionic 列表变成网格

Question

我有一个可点击元素的 ionic 列表，我想将其变成方形元素(框)的网格，但我不知道如何操作。请帮忙。

这是我的 list :

<ion-view>

  <ion-content>
     <ion-list >
      <ion-item ng-repeat="letter in letters" href="#/letters/{{letter.number}}" class="letters-list">
        {{letter.title}}
      </ion-item>
    </ion-list>
  </ion-content>
</ion-view>

请问如何把它变成方形的元素箱？

Answer 1

根据设备大小添加类。 class="col col-50" 用于显示每个元素的大小将占总宽度的 50%。更多信息 http://ionicframework.com/docs/components/#grid

<ion-view>

  <ion-content>
     <ion-list class="row">
      <ion-item class="col col-50" ng-repeat="letter in letters" href="#/letters/{{letter.number}}" class="letters-list">
        {{letter.title}}
      </ion-item>
    </ion-list>
  </ion-content>
</ion-view>

如果您无法使用 ion 标签来完成，请尝试使用 div 标签来完成。

  <ion-content>
     <div class="row">
      <div class="col col-50" ng-repeat="letter in letters" href="#/letters/{{letter.number}}" class="letters-list">
        {{letter.title}}
      </div>
    </div>
  </ion-content>
</ion-view>

其中一个必须有效。当然两者都有。