angularjs - angular star rating directive with no star filled -


how modify angular star rating directive display no star filled (by default) on load? following directive same:

responsecontroller.directive('starrating', function(){      return {       restrict: 'ea',       template:         '<ul class="star-rating" ng-class="{readonly: readonly}">' +         '  <li ng-repeat="star in stars" class="star" ng-class="{filled: star.filled}" ng-click="toggle($index)">' +         '    <i class="fa fa-star"></i>' +         '  </li>' +         '</ul>',       scope: {         ratingvalue: '=ngmodel',         max: '=?',         onratingselect: '&?',         readonly: '=?'       },       link: function(scope, element, attributes) {         if (scope.max == undefined) {           scope.max = 5;         }         function updatestars() {           scope.stars = [];           (var = 0; < scope.max; i++) {             scope.stars.push({               filled: < scope.ratingvalue             });           }         };         scope.toggle = function(index) {           if (scope.readonly == undefined || scope.readonly === false) {             scope.ratingvalue = index + 1;           }         };         scope.$watch('ratingvalue', function(oldvalue, newvalue) {           if (newvalue) {             updatestars();           }         });       }     }; }); 

you can add updatestars(); before $scope.watch(...). render not filled stars. afterwards if value of ratingvalue not undefined, watcher update stars.


Comments

Popular posts from this blog

authentication - Mongodb revoke acccess to connect test database -

r - Update two sets of radiobuttons reactively - shiny -

ios - Realm over CoreData should I use NSFetchedResultController or a Dictionary? -