Ramanaa Gj Ramanaa Gj - 1 year ago 85
Javascript Question

Star Rating: ng-repeat a div or span according to the json value using angularjs

Want to show a

n times according to the value which was received from JSON.

My object:

$scope.pro = [
product: "chicken",
rating: 3
product: "fish",
rating: 3
product: "pizza",
rating: 4

If a product has 3 ratings means the
have to show three times, like a star rating.

How to do it in angular.js?

My Plunker Demo

Answer Source

You can create an array, based on the rating. Then repeat over that array:

<div ng-repeat="array in pro">
    {{array.product}} , <span ng-repeat="n in createArray(array.rating) track by $index">X</span>

In your controller:

$scope.createArray = function(n){    
    return new Array(n);


Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download