user3522722
user3522722

Reputation: 115

Apply limitTo only to certain group of items

$scope.items = [
    {"name":"laptop","color":"green"},
    {"name":"shoe","color":"blue"},
    {"name":"Car","color":"gold"},
    {"name":"Car","color":"gold"},
    {"name":"Car","color":"gold"}
];

How can I limit the items that contain name = 'car' to 2 yet keep other items unaffected in ng-repeat? If I do <li ng-repeat="item in items | filter: {name: 'car'} | limitTo: 2">, it will return 2 car results, but then the other items are gone.

Upvotes: 3

Views: 73

Answers (1)

Dalorzo
Dalorzo

Reputation: 20024

Your scenario sounds more like something related more to a "business logic" than a feature a framework should incorporate. Try implementing your own custom filter.

Something close to:

custom filter:

angular.module('myApp', []).filter('myFilter', function() {
  return function(items, param1, param2) {
    return items.reduce(function(a,c){  var count = a.filter(function(item){ return item.name ===param1; }).length; if(count<param2 || c.name !== param1 ) a.push(c); return a;},[]);
  };
});

and in your html

 <li ng-repeat="item in items | myFilter:'car': 2">

Of course you could extend and perform the actions that are more suited to your app needs.

Here is plunker demo

Upvotes: 4

Related Questions