angularjs ng-repeat: limitTo not limiting object loop

Question

I want to collect past chats with a limit, but this prints out all the chats.

 <div ng-repeat="(key, value) in chats|limitTo:10">
     <a href="" ng-click="ind(key, value);$event.preventDefault()" class="list-group-item">
         <span class="badge">{{value.time}}</span>
         <i class="fa fa-fw fa-calendar"></i> {{value.partner}}
     </a>
</div>

This is the code in the controller.

    $scope.chats = null;
    var chats = {}
    var id = $store.get('doctor_id');
    var d = new Date();

    doctorFactory.getChatRooms(id).then(function(x){
        for (var i in x){
            chats[i] = { partner: x[i] }
        }
        $scope.chats = dateService.doEquation(chats, d);
        console.log($scope.chats);
    }).catch(function(err){
        console.log(err);
    });

console.log($scope.chats) prints out a series of objects:

2016021085524: Object
    clock: "10:15"
    date: "02/10/2016"
    partner: "Magruder_Douglas"
    time: "0 years ago"
2016021085622: Object
    clock: "10:21"
    date: "02/10/2016"
    partner: "Magruder_Douglas"
    time: "0 years ago"

please provide the data in chats

Anik Islam Abhi
– Anik Islam Abhi

2016-02-22 04:49:26 +00:00
Commented Feb 22, 2016 at 4:49 — Anik Islam Abhi
– Anik Islam Abhi, Commented Feb 22, 2016 at 4:49
I just did check it out.

Les Paul
– Les Paul

2016-02-22 05:00:52 +00:00
Commented Feb 22, 2016 at 5:00 — Les Paul
– Les Paul, Commented Feb 22, 2016 at 5:00

harishr · Accepted Answer · 2016-02-22 05:07:42Z

2

limit does not work with objects, for that you will need to implement your own custom filter :

app.filter('objLimitTo', [function(){
    return function(obj, limit){
        var keys = Object.keys(obj);
        if(keys.length < 1) return [];

        var ret = new Object();
        var count = 0;
        angular.forEach(keys, function(key, arrayIndex){
            if(count >= limit) return false;
            ret[key] = obj[key];
            count++;
        });
        return ret;
    };
}]);

i had taken this solution from SO only.. though not able to find the original answer link right now...

answered Feb 22, 2016 at 5:07

harishr

18.1k9 gold badges84 silver badges131 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Les Paul Over a year ago

This is the working solution. Marking this as the right answer.

Community · Accepted Answer · 2017-05-23 12:32:11Z

0

This solution does work but. REFERENCE

angular.module('app', []).controller('homeCtrl', function($scope) {
    $scope.limit = 3;
    $scope.expand = function(limit) { 
      $scope.limit += limit;
    }
    $scope.chat = [{ 'data' : 'one'},{ 'data' : 'two'},{ 'data' : 'three'},{ 'data' : 'four'},{ 'data' : 'five'},{ 'data' : 'six'},{ 'data' : 'seven'},{ 'data' : 'eight'},{ 'data' : 'nine'},{ 'data' : 'ten'},{ 'data' : 'eleven'},{ 'data' : 'twelve'},{ 'data' : 'thirteen'},{ 'data' : 'fourteen'},{ 'data' : 'fifteen'}];
});

edited May 23, 2017 at 12:32

CommunityBot

11 silver badge

answered Feb 22, 2016 at 4:59

Nitin Varpe

10.7k6 gold badges42 silver badges64 bronze badges

3 Comments

Les Paul Over a year ago

No it doesn't, and yes I already tried the solution you referenced.

Nitin Varpe Over a year ago

Why dont you create your own plunkr so that we can get more idea about issue you are having!

Les Paul Over a year ago

Well, the problem is when I get the collection from a Redis call. The above solution works like he has it (I tried by copy-and-pasting his object array) but it doesn't work with mine.

Collectives™ on Stack Overflow

angularjs ng-repeat: limitTo not limiting object loop

2 Answers 2

1 Comment

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related