javascript - 在每个 "x"元素后打开和关闭一个 div

Question

假设我的数组中有 8 个项目。在循环访问这个数组时，我想将它们分成 3 个项目/页，这样就相当于 3 页。

逻辑很清晰，但我不知道如何使用ng-repeat来实现这一点。如果没有直接的方法，我也愿意采用间接的方法。

本质上，我想做这样的事情:

JS

$scope.items = ["A", "B", "C", "D", "E", "F", "G", "H"];
$scope.pages = Math.ceil($scope.items.length/3);

HTML

<div class="box">
    <div class="items" ng-repeat="page in pages">
        <!-- put 3 items here and then create a new ".items" div with the next 3 items and so on -->
    </div>
</div>

预期输出

<div class="box">
    <div class="items">
        <p>A</p>
        <p>B</p>
        <p>C</p>
    </div>
    <div class="items">
        <p>D</p>
        <p>E</p>
        <p>F</p>
    </div>
    <div class="items">
        <p>G</p>
        <p>H</p>        
    </div>
</div>

Answer 1

实现目标的想法是通过使用数组的拼接函数将主数组拆分为最小的数组:https://www.w3schools.com/jsref/jsref_splice.asp

你的分割函数可能看起来像这样:

var _split = function(res,arr, n) {

  while (arr.length) {
    res.push(arr.splice(0, n));
  }

}

我创建了一个 jsfindle 来说明您的要求: http://jsfiddle.net/ADukg/11761/