ionic-rating

> A simple Ionic 4 stars rating component using Angular, with an easy API and support for all methods of binding (Property and Event Binding, Template Forms and Reactive Forms).

📝 Table of Contents

- Prerequisites
- Install
- Setup
- Usage
- Author
- Contributing
- Show your support
- License

✅ Prerequisites

The current version of the library is compatible with Ionic 4. To use it with Ionic 3, please install v1.x.x.

⬇️ Install

Using npm

``sh
npm install --save ionic-rating
`

Using yarn

`sh
yarn add ionic-rating
`

🛠 Setup

Once installed you need to import our module in the parent module for the component you will be using it in:

`js
import { IonicRatingModule } from 'ionic-rating';

@NgModule({
...
imports: [IonicRatingModule, ...],
...
})
export class YourModule {
}
`

Usage

Include the component on page template, like the example below:

`
readonly="false"
size="default"
(rateChange)="onRateChange($event)">

`

Template Forms:

`
readonly="false"
size="default"
(ngModelChange)="onModelChange($event)">

`

Reactive Forms:

`
readonly="false"
size="default"

`

$3

$3

- rate: number [0-5]
- readonly: boolean that controls wether editing the rating is allowed or not
- resettable: boolean that controls wether the rating should reset if the same rate is selected again
- size: 'small' | 'default' | 'large'

$3

- hover: EventEmitter, called whenever you hover on a rating value
- leave: EventEmitter, called whenever you stop hovering on the rating, it passes the last value you hovered on before leaving
- rateChange: EventEmitter, called whenever you select a rating value

$3

`
ion-rating {
--color: gray;
--color-filled: green;
}
``

Author

👤 Rodaina Mohamed

- Github: @RodainaMohamed

🤝 Contributing

Contributions, issues and feature requests are welcome!
Feel free to check issues page.

Show your support

Give a ⭐️ if this project helped you!

📝 License

Copyright © 2019 Rodaina Mohamed.

This project is MIT licensed.