在Angularjs中重复给定数字的元素数量

Question

我将以下对象绑定到我的Angularjs应用程序的$scope

{name: 'Vampire Cafe', rating: 4, review: "Food was good, cafe was a bit dark..."}

我想获取rating的值，并在我的DOM上重复一些图标元素，总计该值

因此，给定上面的对象，元素将重复4次，DOM将如此：

<h3>Rating</h3>
<i class="icon-ios-star"></i>
<i class="icon-ios-star"></i>
<i class="icon-ios-star"></i>
<i class="icon-ios-star"></i>

如何使用简单的Angularjs表达式执行此操作？

Answer 1

目前，ng-repeat只接受一个集合作为参数，但您可以这样做：

<ul>
    <li ng-repeat="i in getNumber(number) track by $index"><span>{{$index+1}}</span></li>
</ul>

在你控制器的某个地方：

$scope.number = 5;
$scope.getNumber = function(num) {
    return new Array(num);   
}

这样您就可以根据需要将$scope.number更改为任意数字，并仍然保留您正在寻找的约束力。

Here is a fiddle，其中有几个列表使用相同的getNumber函数。