Как изменить цвет фона списка?

Question

У меня есть массив данных, поскольку у меня есть три разных типа статуса, например. ok, ожидается истекло. При перечислении в этом массиве мне нужно добавить другой цвет для каждого состояния. Как я могу это сделать?

Это, как я перечисляю массив:

<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> 

Answer 1

Вы можете использовать нг-класс и дать им различные классы CSS.

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

Вы можете прочитать здесь: https://docs.angularjs.org/api/ng/directive/ngClass

Answer 2

Вы можете достичь этого условного оператора нг-класса

<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; 
}