2

一度に N 個のアイテムのチャンクで多数のアイテムを表示しようとしています。マークアップは表形式/グリッド化する必要があるため、項目をチャンクする必要があります (N 項目のグループごとに行があり、次に項目ごとに列があります)。簡単な試みを次に示します。

app.filter('inGroupsOf', function () {
    return function (input, groupSize) {
        if (!input) {
            return [];
        }
        var result = [];
        for (var index = 0; index < input.length; index++) {
            var groupIndex = Math.floor(index / groupSize);
            if (!result[groupIndex]) {
                result[groupIndex] = [];
            }
            result[groupIndex].push(input[index]);
        }
        return result;
    };
});

<div ng-controller="Ctrl">
    <div ng-repeat="itemGroup in items | inGroupsOf:7">
        <span ng-repeat="item in itemGroup">{{item.name}}</span>
    </div>
</div>

(フルバージョンはこちら: http://jsfiddle.net/bradleybuda/twhVj/3/ )

これにより、"10 $digest() iterations reached" エラーが発生します。この質問に対する受け入れられた回答を見てきましたが、そこにある提案は機能しません(フィルターをnukingし、コントローラーでこれをすべて行う以外は)。この種の ng-repeat をテンプレート/フィルターで機能させる方法はありますか? コントローラーでそれを行うのは見苦しいです。

4

1 に答える 1

0

コントローラーの 12 行目により、無限ループが発生しています。

result[groupIndex] = [];

定義されたループ内で配列を作成しているため、$digest ループは発生していませんが、8 行目で作成した配列内でこれらの新しい配列をネストしているためです。

var result = [];

for ループの外側でネストされた配列を作成しても、同じエラーが発生します。

var result = [];
    result[0] = [];

ネストされたオブジェクトでも同じことが起こります。「なぜ」これが起こるかについては、よくわかりません。ドキュメントを読みましたが、配列またはオブジェクトのネストによって $digest ループが発生する理由がよくわかりません。ネストされた配列を文字列または数値に置き換えると、ゴールデンになります。

この場合、ロジックはコントローラーに戻る必要があり、フィルターとして呼び出されることはないと思います。

于 2013-04-25T03:08:40.123 に答える