Retain scroll position on route change in AngularJS?

Question

Sample app: http://angular.github.com/angular-phonecat/step-11/app/#/phones

If you choose the last phone \"Motorola charm\" it will show you the details of the phone

Answer 1

Great solution by @br2000.

However unfortunately my page that I was scrolling back to, was still loading data from backend to a long list when the directive tried to restore the position.

So obviously it failed to restore the scroll position. I solved it by using $interval instead of $timeout and gave it 20 repetitions with 300ms timeout. I stored the promise returned from $interval and then checked inside the $interval function if current position is now the same as stored position and if yes, I call a scope method that cancels the $interval - $interval.cancel(promise).

Additionally, initially my pageYOffset and pageXOffset were always 0, because overflow-x: hidden was applied to the root div in the DOM. I solved it by wrapping the root div inside another div on which I then placed this directive.