角重复<span> n次

Fre*_*ose 14 angularjs

我有一个包含int属性的JSON对象x,我想重复代码x次

<span class="glyphicon glyphicon-star"/>
Run Code Online (Sandbox Code Playgroud)

ng-repeat似乎没有显示,因为它正在与集合一起使用.
任何建议(角新手)

Max*_*tin 23

我会使用自定义过滤器ng-repeat:

HTML

<div ng-app='myApp' ng-controller="Main">
    <li ng-repeat="n in [] | range:20">
      <span class="glyphicon glyphicon-star" >{{n}}</span>
    </li>
</div>
Run Code Online (Sandbox Code Playgroud)

过滤

app.filter('range', function() {
  return function(val, range) {
    range = parseInt(range);
    for (var i=0; i<range; i++)
      val.push(i);
    return val;
  };
});
Run Code Online (Sandbox Code Playgroud)

演示 Fiddle


Jel*_*Cat 8

最短的答案:2行代码

JS(在你的AngularJS控制器中)

$scope.range = new Array(MAX_STARS); // MAX_STARS should be the most stars you will ever need in a single ng-repeat
Run Code Online (Sandbox Code Playgroud)

HTML

<span class="glyphicon glyphicon-star" ng-repeat="i in range.slice(0,starCount) track by $index"/>
Run Code Online (Sandbox Code Playgroud)

...... starCount应该出现在这个位置的星星数量.