javascript - ng-repeat doesn't refresh DOM -

i'm using ng-repeat build datatable, dom doesn't refresh after getting new json data. shown in picture below, when clicking folder, can right json data, doesn't update in view. when use $scope.$apply(), error "digest in progress" here part of code

html:

<tr ng-repeat="x in ::applicationimages" ng-click="rowselect($index)" ng-class="{'selected': selectedrows.indexof($index) != -1}">      <td layout="row" layout-align="start center">         <span>         {{x.type}}         </span>         <a ng-class="{'folder': x.type == 'folder', 'image': x.type == 'image'}" ng-click="getinfo($index); $event.stoppropagation()">         </a>       </td>       <td>       {{x.name}}       </td>  </tr> 

controller:

        /*initial json data*/         $http({             method: 'get',             url: '/services/images/'         }).then(function(response) {              $scope.applicationimages = response.data.payload.list;          },function(response) {              console.log('error');         })        /*get new json when clicking folder*/      $scope.getinfo = function(index) {      if($scope.applicationimages[index].type == 'folder') {         $http({             method: 'get',             url: '/services/images/' + $scope.applicationimages[index].name         }).then(function(response) {            $scope.$apply(function(){                 $scope.applicationimages = response.data.payload.list;                 })          }, function(response) {              console.log('error');         })                                }  } 

you using bind once in ng-repeat. if applicationimages changes, not re-rendered in template. remove :: this

<tr ng-repeat="x in applicationimages" ng-click="rowselect($index)" ng-class="{'selected': selectedrows.indexof($index) != -1}">      <td layout="row" layout-align="start center">         <span>         {{x.type}}         </span>         <a ng-class="{'folder': x.type == 'folder', 'image': x.type == 'image'}" ng-click="getinfo($index); $event.stoppropagation()">         </a>       </td>       <td>       {{x.name}}       </td>  </tr>