帶鍵值列表的角度Ng-重複

我返回一個包含需要迭代的鍵/值的對象。我這樣做是這樣的：帶鍵值列表的角度Ng-重複

ng-repeat="(index, thing) in data"

很簡單，但是我需要將其限制在2項。而常規的limitTo Angular過濾器似乎不能以這種方式工作。在視圖中是否可以過濾這種方式？還是必須在數據到達視圖之前修改數據？例如，我希望能夠做到這一點：

ng-repeat="(index, thing) in data | limitTo:2"

來源

2013-10-16 flashpunk

你可以寫自己的過濾器被稱爲像limitObjecTo能夠與只有前兩個屬性返回一個對象。

有沒有一些原因，你不使用數組？這似乎更合適。

例子：http://jsfiddle.net/LgTfs/

.filter('limitObjectTo', function() { 
    return function(obj, limit) { 
    var newObj = {}, i = 0, p; 
    for (p in obj) { 
     newObj[p] = obj[p]; 
     if (++i === limit) break; 
    } 
    return newObj; 
    }; 
});

來源

2013-10-16 16:23:55 Langdon

不幸的是，我並沒有很多關於如何構建API的決定。 – flashpunk

如果您不控制API，您仍然可以將數據轉換爲使用Javascript的常規數組。這將使使用像limitTo這樣的過濾器變得更容易。 –

感謝@Langdon爲您解決！我做了一些改進，以限制來自並將其限制爲：

.filter('limitObjectFromTo', function() { 
     return function(obj, limitFrom, limitTo) { 
     var newObj = {}, 
      i = 0; 
      for (var p in obj) { 
      if (i >= limitFrom) newObj[p] = obj[p]; 
      if (++i === limitTo) break; 
      } 
     return newObj; 
     }; 
    });

也許有人會:-)使用它，那麼你只需要添加：| limitObjectFromTo: 2:6限制爲2至6

來源

2014-04-03 08:42:02 szymonm

我設法利用$index與ng-if組合鍵如下

fruVeg = { 
       'a' : 'apple', 
       'b' : 'banana', 
       'c' : 'carrot', 
       'd' : 'fandelion', 
       'e' : 'eggs', 
       'f': 'fig' 
      };

過濾在我的模板，我這樣做是爲了限制它的前4鍵在funcs中對象

<label ng-repeat='(key,val) in fruVeg' ng-if="$index<4"> [[key]]</label>

來源

2015-11-11 15:42:45

帶鍵值列表的角度Ng-重複

回答

相關問題