如何在沒有陣列的情況下在 AngularJS 中迭代定義的次數？

ng-repeat 的替代方法：迭代定義的次數

在 AngularJS 中，ng-repeat 指令允許我們迭代元素數組。然而，在某些情況下，即使沒有數組，我們也可能希望多次重複特定模板。本文解決了這個需求。

解

1.3.0 版本之前的 AngularJS 不支援直接迭代指定次數。解決方法涉及引入自訂函數和操作數組。

這是修改後的ng-repeat 語法：

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

在控制器中，定義getNumber 函數：

<code class="js">$scope.number = 5;
$scope.getNumber = function(num) {
    return new Array(num);
}</code>

此函數傳回指定長度的陣列，模擬迭代數組的行為。

AngularJS 更新>= 1.3.0

較新版本的AngularJS 提供了簡化的解決方案:

<code class="html"><li ng-repeat="x in [].constructor(number) track by $index">
    <span>{{ $index+1 }}</span>
</li></code>

這種變體消除了對自定義函數的需要。

結論

這兩種方法都提供了一種靈活而有效的方法來在 AngularJS 中迭代定義的次數，使開發人員能夠創建動態且適應性強的用戶界面。

以上是如何在沒有陣列的情況下在 AngularJS 中迭代定義的次數？的詳細內容。更多資訊請關注PHP中文網其他相關文章！