How can i print a star patterns using angularjs(can i use ng-repeat)

Question

<span name="hover-star" data-toggle="tooltip" data-placement="bottom" class="red-tooltip" data-html="true" title="<div class='row' style='font-size:10px; color:blue; '><span class='glyphicon glyphicon-star col-sm-1' style='width:3%'></span>

<span class='glyphicon glyphicon-star col-sm-1' style='width:3%'></span>

<span class='glyphicon glyphicon-star col-sm-1' style='width:3%'></span>

<span class='glyphicon glyphicon-star col-sm-1' style='width:3%'></span>

<span class='glyphicon glyphicon-star col-sm-1' style='width:3%'></span>

The above code i have used in HTML to print the pattern as * * * * * in a tooltip

i have used the jquery callbyname in my .js file
$('span[name="hover-star"]').tooltip(); for tooltip functionality

Now,i want to include the pattern * ** *** **** ***** in my tooltip using angularjs ng-repeat directive(i have read in a document it works as for loop).

Thank you

Answer 1

Try out the following by using nested ng-repeat

<div ng-repeat="i in getNumberPattern(numberPattern) track by $index" style="display:inline;">
  <span ng-repeat="i in getNumberPattern($index) track by $index">*</span>
</div>

Check out the Plunker link

In the answer I have simply displayed character *, add your own styling to display the icons.

How can i print a star patterns using angularjs(can i use ng-repeat)

Sign up