AngularJS ng-repeat index limit?

Question

is there a way to represent a value based on specific data and put a limit on it?

i wanna show only 3 value of span but this is show up 4 span.

help me

this is my example code

<div ng-repeat="list in checkDate">
   <span ng-if="list.day == '20200120'">{{list.time}} {{list.day}}</span>
</div>

$scope.checkDate = [{
            day: '20200120',
            time: '09:30'
        }, {
            day: '20200119',
            time: '10:30'
        }, {
            day: '20200120',
            time: '11:30'
        },
        {
            day: '20200109',
            time: '12:30'
        },
        {
            day: '20200125',
            time: '13:30'
        },
        {
            day: '20200120',
            time: '14:30'
        },
        {
            day: '20200120',
            time: '15:30'
        }
    ]

Answer 1

The main reason is why ng-if is inside ng-repeat .

So if you try with only limitTo it will not work.

First you have to filter record based on your desired date and than you have to apply limitTo to ng-repeat .

Solution - ng-repeat="list in checkDate | filter: {day: '20200120'} | limitTo:3"

try this - https://jsfiddle.net/qkvf2ojh/

Answer 2

It's because ng-if is applied after limitTo filter producing result. In this case, use filter instead of ng-if directive. For example,

   <div ng-repeat="list in checkDate | filter: {day: '20200120'} | limitTo:3">
       <span>{{list.time}} {{list.day}}</span>
   </div>