Angular 2 “ng-style” within “*ngFor” background color change

You can change the background colour using [style.backgroundColor]:

<i class="icon" [style.backgroundColor]="item.bgcolor"></i>

If of course the string in item.bgcolor is a valid css colour string:

#FFFFFF white rgb(255,255,255) rgba(255,255,255,1)

Which in your case isn't.. You are missing the leading # and you should change your item list to this:

items: [
      { bgcolor: '#fb9667', img: 'airTicket', category: 'Air tickets' },
      { bgcolor: '#000000', img: 'airTicket', category: 'Beauty/Fitness'},
      { bgcolor: '#0b9660', img: 'airTicket', category: 'Bike'}
]

You can directly apply this css and the alternate rows will have different color

li { background: green; }

li:nth-child(odd) { background: red; }