Skip to content

fraserxu/ionic-rating

Repository files navigation

ionic-rating

An angularjs directive that take care of visualising a star rating bar, build for ionic.

rating

Also able to print half star (display only) :

rating-half

Why?

angular-ui has the same rating directive, but it is build on top of bootstrap. This repo just reuse most of the js code, but build for the ionic framework.

How to use?

Install with bower:

$ bower install ionic-rating

In your index.html

<script src="lib/ionic-rating/ionic-rating.min.js"></script>

In you template:

<rating ng-model="rating.rate" max="rating.max"></rating>

In you controller:

// first inject it into your app
angular.module('youApp', ['ionic.rating'])

.controller('yourCtrl', function($scope) {

  // set the rate and max variables
  $scope.rating = {};
  $scope.rating.rate = 3;
  $scope.rating.max = 5;

});

For strict-di, you can use

.controller('RatingController', [ '$scope', '$attrs', 'ratingConfig', function($scope, $attrs, ratingConfig) ]

If you want to make it read only

added readonly="readOnly" to rating directive, and $scope.readOnly = true; to the controller.

Note: You may also need to include the style file. But I suggest you just copy it to your project.

Build

$ npm i
$ make all

License

MIT

About

An angularjs directive that take care of visualising a star rating bar

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Contributors 4

  •  
  •  
  •  
  •