nxtlife-ionic2-rating
An Angular2 component to visualize a star rating bar, built for Ionic 2.
Last updated 2 years ago by tusharbalar1 .
MIT · Repository · Bugs · Original npm · Tarball · package.json
$ cnpm install nxtlife-ionic2-rating 
SYNC missed versions from official npm registry.

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;
    }
  }
}

Current Tags

  • 1.2.1                                ...           latest (2 years ago)

21 Versions

  • 1.2.1                                ...           2 years ago
  • 1.2.0                                ...           2 years ago
  • 1.1.9                                ...           2 years ago
  • 1.1.8                                ...           2 years ago
  • 1.1.7                                ...           2 years ago
  • 1.1.6                                ...           2 years ago
  • 1.1.5                                ...           2 years ago
  • 1.1.4                                ...           2 years ago
  • 1.1.3                                ...           2 years ago
  • 1.1.2                                ...           2 years ago
  • 1.1.1                                ...           2 years ago
  • 1.1.0                                ...           2 years ago
  • 1.0.9                                ...           2 years ago
  • 1.0.8                                ...           2 years ago
  • 1.0.7                                ...           2 years ago
  • 1.0.5                                ...           2 years ago
  • 1.0.4                                ...           2 years ago
  • 1.0.3                                ...           2 years ago
  • 1.0.2                                ...           2 years ago
  • 1.0.1                                ...           2 years ago
  • 1.0.0                                ...           2 years ago
Maintainers (1)
Downloads
Today 0
This Week 0
This Month 1
Last Day 0
Last Week 0
Last Month 145
Dependencies (0)
None
Dependents (1)

Copyright 2014 - 2016 © taobao.org |