Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Angular - Any reason why updating scope would cause page scroll

In Angular is there any reason why updating a $scope variable would cause my page to scroll to the top?

Simply, the variable i am updating is $scope.searchResults however each time its updated, the page scrolls to the top.

if ($routeParams.textToSearch == 'new') {

        getService.getResults('EU', 50)
        .then(function (data){
          $scope.searchResults = data.data[0];
        });

    }

Any ideas?

Detailed HTML as requested - this is in my <ng-view autoscroll="true"></ng-view>: (note I have tried autoscroll at false as well - issue still persists .

<div equalizer="'group'" " ng-repeat="question in searchResults">

<div class="searchTile" equalizer="'group'">

        <div id="circle{{$index}}">
          <nvd3 options="circleOptions" data="question.options"></nvd3>
        </div>

</div>
</div>
like image 493
userMod2 Avatar asked Sep 02 '25 01:09

userMod2


1 Answers

There is an ng-repeat in your code. Whenever you update your data, the ng-repeat has to delete then recreate its part of the page. So the page shrinks and regrows. So if appears that it scrolled to the top.

Adding a track by to the ng-repeat may help as it will then recognise that most of the cells are the same so keep them in the DOM, which should stop all the rows being destroyed when they match.

like image 76
Mike Avatar answered Sep 04 '25 14:09

Mike