List View style


#1

Hello,
I’m trying to create a ion-list with a different style of what “comes out of the box”. I’m trying to build something like this:

How can I achieve this with the < ion list > and < ion-item>?
Is there a way to condition the < ion item > item class, based on the index?
I’m new to the platform, and I don’t know very well my way around this.


#2

What about using a Grid instead?


#4

So you could use ng-class in combination with ng-repeats index.

<h1 ng-repeat="item in items" ng-class="{'red' : $index % 3 == 0 }">
  {{item.name}}
</h1>

#5

Thanks for your solution. I ended up using a < ion item > like this:
< ion-item
ng-repeat="item in items"
ng-class=“item.class” >

item {{$index}}

< /ion-item >

…which is basically the same thing :slight_smile:


#6

A more complete picture.