Her zaman bir dizi üzerinde yineleme yapmak yerine belirli sayıda ng-yinelemesi yapmanın bir yolu var mı?
Örneğin, aşağıda $scope.number
değerinin 5'e eşit olduğunu varsayarak liste öğesinin 5 kez görünmesini ve ayrıca her liste öğesinin 1, 2, 3, 4, 5 gibi artması için sayıyı artırmasını istiyorum
İstenen sonuç:
<ul>
<li><span>1</span></li>
<li><span>2</span></li>
<li><span>3</span></li>
<li><span>4</span></li>
<li><span>5</span></li>
</ul>
Şu anda, ng-repeat
parametre olarak yalnızca bir koleksiyon kabul etmektedir, ancak bunu yapabilirsiniz:
<ul>
<li ng-repeat="i in getNumber(number)"><span>{{$index+1}}</span></li>
</ul>
Ve kontrol cihazında bir yerde:
$scope.number = 5;
$scope.getNumber = function(num) {
return new Array(num);
}
Bu, $scope.number
ı istediğiniz herhangi bir sayıya değiştirmenize ve yine de aradığınız bağlamayı korumanıza olanak tanır.
Aynı getNumber
fonksiyonunu kullanan birkaç liste ile [İşte bir keman][1].
1/6/2014'TE DÜZENLE: Angular 1.x'in daha yeni sürümleri aşağıdaki sözdizimini kullanır:
<li ng-repeat="i in getNumber(number) track by $index">
9/25/2018'DE DÜZENLE: Angular 1.x'in daha yeni sürümleri, bunu bir fonksiyon olmadan yapmanıza izin verir. Kodunuz basitse ve başka nedenlerden dolayı bir getNumber
fonksiyonuna ihtiyacınız yoksa, artık bunu atlayabilir ve sadece bunu yapabilirsiniz:
<div ng-repeat="x in [].constructor(number) track by $index">
Bu güncelleme için @Nikhil Nambiar'a aşağıdaki cevabından dolayı teşekkür ederiz
İşte bunu nasıl yapabileceğinize dair bir örnek. ng-repeat dokümanlarındaki bir yorumdan esinlendiğimi unutmayın:
ng-repeat yönergesine dikkat edin:
<div ng-app>
<div ng-controller="TestCtrl">
<div ng-repeat="a in range(5) track by $index">{{$index + 1}}</div>
</div>
</div>
İşte kontrolör:
function TestCtrl($scope) {
$scope.range = function(n) {
return new Array(n);
};
};