Scroll to in angularjs

Question

I am trying to scroll to an element on the page after I \'show\' it. I.E. i have a very long list of users and I display them as a list. Each element has an edit icon you can

Answer 1

For future reference - and anyone who came here with the same problem about scrolling but is not using ng-routes to scroll, @Ben_Lesh's answer is actually quite insightful.

I was using

$location.hash(id)
$anchorScroll()

to scroll, but also running into the same problem regarding first-time click not working. I realized that the problem was that my first click set the object visible, and then tried to scroll to it, but at the time of scroll, the element was still not visible on the page. Then at the end of the cycle, the page re-renders.

The second time I click, the element is now set to visible, so the scrolling works fine.

The solution is, after you set the boolean that makes your element visible, to call an

$timeout(function() {$scope.$apply()},0)

then call your scroll function. This way you force the re-render before the scroll. Voila!