How to change the background colour of list?

Hi I am new in angularjs, i have an array of data in that i have three different type of status e.g. ok, pending,expired ,while listing on this array i need to add different color for each status. how can i do that?

<ion-list>
  <ion-item ng-repeat="playlist in playlists" href="#/app/playlists/{{playlist.id}}">
    <img src="{{playlist.src}}" id="thumbnile">
    {{playlist.name}}
  </ion-item>
</ion-list>

this how i am listing the array

You could use ng-class and give them different css classes.

<p ng-class="{strike: deleted, bold: important, red: error}">Example</p>

You can read more here: https://docs.angularjs.org/api/ng/directive/ngClass

You can achieve this by ng-class conditional operator

<ion-item ng-repeat="playlist in playlists" href="#/app/playlists/{{playlist.id}}">
    <p ng-class="{ 'okay': 'status-okay', 'pending': 'status-pending', 'expired' : 'status-expired'}[playlist.status]">
      <img src="{{playlist.src}}" id="thumbnile">{{playlist.name}}
    </p>
</ion-item>

CSS

.status-okay {
    background-color: green;
}

.status-pending {
    backgroud-color: yellow;
}

.status-expired {
    backgroud-color: red;
}