角度，限制子重复[重复]答案

【问题标题】：Angular, limit sub repeat [duplicate]角度，限制子重复[重复]
【发布时间】：2015-06-27 01:19:39
【问题描述】：

我试图通过其父重复的索引来限制子重复。因此，无论它在其上的任何级别索引都将限制为（+ 1，因此我们不从 0 开始）。这是我的想法 -

        <div class="inputRepeater" ng-repeat="face in inputFaces" ng-show="face.isCurrent" >
            <div class="trialGrid">
                <table class="table table-striped">
                    <thead>
                    <tr>
                        <th ng-repeat="(key, val) in rowCollection[0]">{{key}}</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr ng-repeat="row in rowCollection | limitTo: face.$index + 1">
                        <td ng-repeat="item in row">{{item}}</td>
                    </tr>
                    </tbody>
                </table>
            </div>
</div>

因此，表中的 tr 将仅限于 face, buy faces $index + 1 的初始重复。这是行不通的。任何见解将不胜感激。谢谢！

【问题讨论】：

控制台出现什么错误？

标签： javascript angularjs angularjs-ng-repeat ng-repeat

【解决方案1】：

你可以使用ng-init来保存对上$index的引用

    <div class="inputRepeater" ng-repeat="face in inputFaces" ng-show="face.isCurrent" >
        <div class="trialGrid" ng-init="$faceIndex = $index">
            <table class="table table-striped">
                <thead>
                <tr>
                    <th ng-repeat="(key, val) in rowCollection[0]">{{key}}</th>
                </tr>
                </thead>
                <tbody>
                <tr ng-repeat="row in rowCollection | limitTo: $faceIndex + 1">
                    <td ng-repeat="item in row">{{item}}</td>
                </tr>
                </tbody>
            </table>
        </div>
    </div>

【讨论】：

漂亮！正是我要找的，谢谢！

【解决方案2】：

不要使用face.$index，而是使用$parent.$index，因为您想引用父级ng-repeat $index。因为 ng-repeat 创建了一个与其当前运行范围隔离的范围。

代码

<div class="inputRepeater" ng-repeat="face in inputFaces" ng-show="face.isCurrent">
    <div class="trialGrid">
        <table class="table table-striped">
            <thead>
                <tr>
                    <th ng-repeat="(key, val) in rowCollection[0]">{{key}}</th>
                </tr>
            </thead>
            <tbody>
                <tr ng-repeat="row in rowCollection | limitTo: $parent.$index + 1">
                    <td ng-repeat="item in row">{{item}}</td>
                </tr>
            </tbody>
        </table>
    </div>
</div>

希望这对你有帮助。

【讨论】：