2013-12-08 13 views
14

コレクションがdupesが含まれているため、次のコードは動作していない含まれていますNG-繰り返しコレクション上で動作していないdupes

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

私は次のように動作するはずだと思いますが、残念ながら動作していない:

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

これはバグですか?

ダブを含むコレクションに対してng-repeatを使用する方法はありますか?

事前のおかげで、

オリヴィエ

答えて

17

は、この機能は、新しいバージョンでAngularJSに追加されました。 基本的には、いくつかの基本的な型(数字など)ではなく、複雑なオブジェクトを繰り返し処理する必要があります。

ngRepeatディレクティブは参照が実際の値ではないことを理解していますので、いくつかの複雑なオブジェクトを繰り返し処理すると、そのオブジェクトは覚醒しますが、プリミティブ型のセットで処理しようとすると、長く「すべて」の値はお互いに異なる。

EDIT

次の行がコピーされ、this linkから貼り付け(とあなたがAngularJSの比較的最新のバージョンを使用していることを確認してください - 私は1.1.5を使用していますし、それは完全に働いています - )

説明

重複キーがngRepeat式に存在する場合に発生します。 AngularJSはキーを使用してDOMノードをアイテムに関連付けているため、重複キーは使用できません。

デフォルトでは、コレクションはほとんどの一般的なモデルには望ましいが、内部(共有参照)のプリミティブ型には問題があります。いずれかのこのエラーを解決するコレクション内の項目を追跡する方法を指定する構文でトラックを使用する独自のアイデンティティを持っていることを確認するために

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

:たとえば、問題は、この不正なコードによってトリガすることができ

モデルとDOMの関連付け。例では、上記の項目ではなく、その値の配列にその位置をキーとすることが原因となる、$インデックスでトラックを使用することによって解決することができます解決するには

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

でも、 'track by $ index'はint noで動作するはずですか? – odwl

+0

'track by $ index'は実装されているようです。http://stackoverflow.com/questions/21763136/ –

2

一つます行番号documentationのように "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のリピートを行います。

0

角膜フィルター第三者フィルターには、固有のフィルターが含まれており、コレクション内の固有の項目だけが表示されます。

https://github.com/a8m/angular-filter

使用法:

コレクション|ユニーク: 'プロパティ'

関連する問題