How can i use ion-icon into rating component

hi guys,
i write a little rating component and its works pretty fine , but i’m using bootstrap css
how can i use ion-icon into this?

my component look like this

  selector: 'rating',
  inputs: ['rate'],
  outputs: ['updateRate: rateChange'],
  template:  `
    <span tabindex="0">
      <template ngFor #range [ngForOf]="range" #index="index">
        <span class="sr-only">({{ index < rate ? '*' : ' ' }})</span>
        <i style="font-size: 50px;" gold class="glyphicon" (click)="update(index + 1)" [ngClass]="index < rate ? 'glyphicon-star' : 'glyphicon-star-empty'"></i>

Would something like this work?

<ion-icon [name]="index < rate ? 'star' : 'star-outline'"></ion-icon>

getting template parse errors:
Parser Error: Conditional expression ‘star’ ? ‘star-outline’ requires all 3 expressions at the end of the expression

Sorry, edited my post to fix typo in ?: operator. I had two '?'s.

many thanks but rating doesnt show up

Just for information, I created an ionic 2 rating component:

1 Like