I wrote code to repeat an image array and a load more button to ajax request and push response images in that array. But every time new response comes then whole images reshuffled.

```
<div class="container">
    <div ng-repeat="image in images track by $index">
        <div class="panel panel-default">
           <div>
             <img ng-src="{{image.Src}}" alt="" height="200" width="200">
          </div>
       </div>
   </div>
</div>

```

And in my controller code:

```
$scope.loadMore = function () {
     pageNumber ++;
     homeService.getListData(pageNumber)
                           .then(function (data) {
                               for (var i = 0; i < data.length; i++) {
                                   $scope.images.push(data[i]);
                               };
                        });
                    };
                };

```

every time server send three images. Previously I didn't use `track by $index` then from [from this SO answar](https://stackoverflow.com/questions/17079541/angularjs-ng-repeat-with-dynamic-list-without-rebuilding-entire-dom-tree) I added `track by $index` but no luck.

I think angular is re-rendering the whole array. If so, how can I stop this re-rendering?