14

コレクションに重複が含まれているため、次のコードは機能しません。

<div ng-repeat="value in [4, 4]"></div>

以下は機能するはずですが、残念ながら機能していません。

<div ng-repeat="value in [4, 4] track by $index"></div>

それはバグですか？

ng-repeat重複を含むコレクションを使用する方法はありますか?

前もって感謝します、

オリビエ

4

3 に答える 3

17

この機能は、新しいバージョンの AngularJS に追加されました。ポイントは、基本的に、一部のプリミティブ型 (数値など) ではなく、一部の複雑なオブジェクトを反復処理する必要があるということです。

私が理解したことから、ngRepeatディレクティブは実際の値ではなく参照をチェックするため、いくつかの複雑なオブジェクトを反復処理するとうまくいきますが、一連のプリミティブ型に対してそれを実行しようとすると、「すべて」である限り機能しない可能性が高くなります値は互いに異なります。

編集

次の行は、このリンクからコピーして貼り付けたものです (AngularJS の比較的最新のバージョンを使用していることを確認してください - 私は 1.1.5 を使用しており、完全に動作しています -)

説明

ngRepeat 式に重複するキーがある場合に発生します。AngularJS はキーを使用して DOM ノードを項目に関連付けるため、重複キーは禁止されています。

デフォルトでは、コレクションは参照によってキー設定されます。これは、ほとんどの一般的なモデルでは望ましいことですが、インターンされている (共有参照) プリミティブ型では問題になる可能性があります。

たとえば、この問題は次の無効なコードによって引き起こされる可能性があります。

<div ng-repeat="value in [4, 4]">
</div>

このエラーを解決するには、コレクション内のアイテムに一意の ID があることを確認し、track by 構文を使用して、モデルと DOM 間の関連付けを追跡する方法を指定します。

上記の例を解決するには、track by $index を使用して解決できます。これにより、アイテムは値ではなく配列内の位置によってキー付けされます。

<div ng-repeat="value in [4, 4] track by $index"></div>
于 2013-12-08T10:34:57.560 に答える
2

できることの 1 つは、angularドキュメントのように「track by $index」を追加することです。これにより、追跡ロジックが要素の値ではなく要素のインデックスに変更されますが、これにより、繰り返される値が表示されます。一意の値のみを表示するには、次のような関数を記述して、一意の値を除外できます。

    var uniqueValues = function(data){
        var check = {};
        var uniqueValue = [];
        for(i-0;i<data.length;i++){
           if(!check[data[i]]){
              uniqueValue.push(data[i]);
              check(data[i]) = true;
           }
        }
        return uniqueValue;
}

そして、これに対して ng-repeat を実行します。

于 2015-06-06T08:13:55.013 に答える