AngularJS ng-repeat loops double than actual length of records

Question

I saw many questions related to 'dirty check'. Want to confirm my below issue is due to that.

I have JSON string from RestService: Basically two records

[{"intRowId":111,"fltAmt":6.0,"intCnt":2,"category":{"intCatId":2,"strCatName":"Rent"},"monthYear":"2016-01-01"},
{"intRowId":112,"fltAmt":3.0,"intCnt":1,"category":{"intCatId":3,"strCatName":"Phone"},"monthYear":"2016-01-01"}]

I have ng-repeat in HTML page: I am calling a method AssignValues.

<tr ng-repeat="op in resultReport">
        <td>{{$index+1}}{{resultReport.length}}{{AssignValues(op.fltAmt,$index,op.monthYear)}}</td>
        <td>{{op.fltAmt|currency}}</td>
        <td>{{op.intCnt}}</td>
        <td>{{op.category.strCatName}}</td>
        <td>{{op.monthYear}}</td>
      </tr>

AssignValues in my Controller: This prints four times.

$scope.AssignValues = function(amt,ind,mYr){
        $log.log(amt);
    }

Actually I have two records in JSON, but the function prints the values repeated more than actual length. Instead of just 6 and 3, it prints 6,3,6,3. Screen shot is attached below. Any one please help me to understand this.

it is by design in angular 1x, dont call function directly from template. — YOU, Jan 23 '16 at 09:30
Thanks @NitinVarpe for quick answer. I edited the question. I meant that instead of two records it actually prints 4 times. — Shamseer, Jan 23 '16 at 09:31
@YOU, I could manage it by passing the $index. But wanted to clarify whether it is expected or ng-repeat has different variations. — Shamseer, Jan 23 '16 at 09:35
Check this http://stackoverflow.com/questions/14987277/function-called-multiple-times-in-angularjs-repeat-section — Nitin Varpe, Jan 23 '16 at 09:37

score 2 · Accepted Answer · answered Jan 23 '16 at 09:30

2

The digest loop consists in evaluating the expressions until their values are stable. To know if they're stable, angular needs to evaluate them twice, to test if the value obtained from the first evaluation is the same as the value obtained from the second one.

So what you see is expected and normal.

answered Jan 23 '16 at 09:30

JB Nizet

678,734
91
1,224
1,255

Thanks for the clarification. Any reference could be really helpful – Shamseer Jan 23 '16 at 09:32
1

https://docs.angularjs.org/guide/scope, https://docs.angularjs.org/api/ng/type/$rootScope.Scope#$digest – JB Nizet Jan 23 '16 at 09:35
I never knew ! Thanks. – Gaurav Gandhi Jan 23 '16 at 09:40

AngularJS ng-repeat loops double than actual length of records

1 Answers1