1.2.1 • Published 7 years ago

nxtlife-ionic2-rating v1.2.1

Weekly downloads
84
License
MIT
Repository
github
Last release
7 years ago

nxtlife-ionic2-rating

Build a simple directive to visualize a star rating bar using angular2 and ionic2.

NPM version Downloads

NPM

Installation:

$ npm install --save nxtlife-ionic2-rating

Usage:

Import NxtLifeIonic2RatingModule on module definition that declares the page where you want to add the rating component. In some cases, all pages are declared on src/app/app.module.ts.

import { NgModule } from '@angular/core';
import { IonicModule } from 'ionic-angular';
import { MyApp } from './app.component';

// Import ionic2-rating module
import { NxtLifeIonic2RatingModule } from 'nxtlife-ionic2-rating';

@NgModule({
  ......
  ......
  imports: [
    IonicModule.forRoot(MyApp),
    NxtLifeIonic2RatingModule // Put ionic2-rating module here
  ],
  ......
  ......
})
export class AppModule {}

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

<nxtlife-rating></nxtlife-rating>

DEFAULT VALUE

readOnly = false,
max = 5,
emptyStarIconName = "star-outline",
halfStarIconName = "star-half",
starIconName = "star",
nullable = false

When you need to do something when user clicks on a start then you have to use (click) or (ngModelChange) with [(ngModel)]:

<nxtlife-rating [(ngModel)]="rate" (ngModelChange)="onModelChange($event)">
</nxtlife-rating>

If you want to customize style:

ul {
  padding: 0px;

  &.rating li {
    padding: 5px 10px !important;
    background: none;
    color: #ffb400;

    ion-icon {
      font-size: 30px;
    }
  }
}
1.2.1

7 years ago

1.2.0

7 years ago

1.1.9

7 years ago

1.1.8

7 years ago

1.1.7

7 years ago

1.1.6

7 years ago

1.1.5

7 years ago

1.1.4

7 years ago

1.1.3

7 years ago

1.1.2

7 years ago

1.1.1

7 years ago

1.1.0

7 years ago

1.0.9

7 years ago

1.0.8

7 years ago

1.0.7

7 years ago

1.0.5

7 years ago

1.0.4

7 years ago

1.0.3

7 years ago

1.0.2

7 years ago

1.0.1

7 years ago

1.0.0

7 years ago