An Angular2 component to visualize a star rating bar, built for Ionic 2.
$ npm install --save ionic2-rating
import { Ionic2RatingModule } from 'ionic2-rating';
@NgModule({
imports: [
Ionic2RatingModule
]
})
export class AppModule {}
Important: there is an open issue about the use of third party libraries on Ionic 2 RC.0 apps: ionic-team/ionic-framework#8322
$ npm install --save [email protected]
In your component:
import { Ionic2Rating } from 'ionic2-rating';
@Component({
templateUrl: '...',
directives: [Ionic2Rating]
})
export class MyComponent {
private rate = 2.5;
}
<rating [(ngModel)]="rate"></rating>
If you want to make it read-only, use "readOnly" property:
<rating [(ngModel)]="rate" readOnly="true"></rating>
If you want to change the number of stars, use "max" property (default is 5):
<rating [(ngModel)]="rate" max="10"></rating>
You may also need to customize component styles:
ul.rating li {
display: inline;
border: 0px;
background: none;
color: #ffb400;
}
Based on ionic-rating for Ionic 1: https://github.com/fraserxu/ionic-rating