11

When navigating around the developer's guide for AngularJS, I noticed that I do not go back to my last scroll position when navigating back to a page using the back button. Instead, I go right back to the top. Since the developer's guide is built with AngularJS, I am afraid that, when I build my own web application with AngularJS, it will annoy my users if they have this same experience. Why is this happening, and how can it be fixed? Do I need to use HTML5's history API somehow?

Go to the developer's guide and see this behavior yourself: http://docs.angularjs.org/guide/directive

1
  • 2
    Generally most browsers don't wait for xhrs to do the "scrolling" so when you hit the back button the page is done "scrolling" before the content is "loaded". I haven't investigated any solutions yet though. Commented Jun 14, 2013 at 4:26

2 Answers 2

8
+50

If you want to fix it, I can think of an idea of keeping the track of every route scroll position in a map (in service or on a rootScope) - when you are leaving the page ($routeChangeStart listener) just save the scroll position together with route path.

And when coming to any page, you can check if a record in a map exists for the route path and scroll window to desired position on $routeChangeSuccess event

Sign up to request clarification or add additional context in comments.

Comments

0

You should look into the Angular $anchorScroll service.

http://docs.angularjs.org/api/ng.$anchorScroll

It is for exactly your scenario! The sample code pretty much speaks for itself.

1 Comment

This will only work for positions that are marked with <a id="somewhat">. The question is regarding any position not only a marked position.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.