Skip to content
Create rating inputs easily ⛺
Branch: master
Clone or download
Pull request Compare This branch is 7 commits ahead of whitef0x0:master.
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Type Name Latest commit message Commit time
Failed to load latest commit information.


With this directive you can build rating inputs easily.

Look! A demo!

Installation via bower

	bower install angular-input-stars

Inject it

    angular.module('app', ['angular-input-stars'])


	<input-stars max="5" ng-model=""></input-stars>

You can customize the base, empty, hover, and full and icon classes via attributes

	<input-stars max="5" icon-base="fa fa-fw" icon-empty="fa-circle-o" icon-hover="hover" icon-full="fa-circle" ng-model=""></input-stars>

Unlike icon-base, on icon-full, icon-hover and icon-empty you must specify only one class, but that is all you need : ]

You can add a $rootScope function that will be called each time after a star is clicked by using the optional onStarClick attribute when the onShapeClick attribute is set to true

	<input-stars max="5" on-star-click="runMyFunction()" ng-model=""></input-stars>

You can customize the list class to whatever you want

	<input-stars max="5" list-class="shiny-list" ng-model=""></input-stars>

You can make it readonly thanks to @anjorinjnr

	<input-stars max="10" list-class="shiny-list" ng-model="" readonly ></input-stars>
	<input-stars max="10" list-class="shiny-list" ng-model="" readonly="true" ></input-stars>
	<input-stars max="10" list-class="shiny-list" ng-model="" readonly="readonly" ></input-stars>

The .css file is optional and it is a bootstrap for customizations.

##Dependencies This directive uses FontAwesome as fallback if you don't specify any icon class.


MIT License © Rafael Mello Campanari

You can’t perform that action at this time.