Ion-grid styling row

Ionic Framework ionic-v3
1

I want to make each row different color, how to apply that in a grid?


      <ion-row *ngFor="let fact of data.facts" ng-class="{$even ? col1 : col2}">
        <ion-col>
          {{fact[0]}}
        </ion-col>
        <ion-col>
          {{fact[1]}}
        </ion-col>
      </ion-row>
2

It depends on your version of Angular, which one are you on? ng-class is old syntax, that’s not going to work. If you’re using Angular4:

<ion-row *ngFor="let fact of data.facts; index as i; odd as isOdd; even as isEven" 
    [class.Odd]="isOdd" 
    [class.even]="isEven"> 
      <ion-col>{{fact[0]}}</ion-col>
      <ion-col>{{fact[1]}}</ion-col>
</ion-row>

This stackOverflow post as reference:

1 Like