7

I have a ui-view inside of my page. When some button is clicked, the ui-view is loaded and replaced by some HTML. I want the page to be scrolled down to the just-loaded part of the page.

Is this possible? Thanks in advance

1

2 Answers 2

23

The ui-router module has been updated to scroll to the ui-view by default. You can add the autoscroll="false" attribute on <div ui-view> to prevent this. The default setting is true which scrolls to the ui-view upon state change.

I would think it should be the other way around where you have to set the autoscroll to enable rather than disable but this is the functionality of the updated ui-router.

You can read about it here.

In the linked Github issue, it says that the default value is autoscroll="expr" but I have found that expr does nothing and that the default value is autoscroll="true" (which makes more sense).

1
  • Thanks for writing this. This new update has been driving me insane, as all my pages suddenly loaded scrolled down, and I couldn't figure out why. Thank you!
    – ac360
    Commented Feb 12, 2014 at 18:29
2

On Route change it will scroll to the top of the page.

 $scope.$on('$routeChangeSuccess', function () {
      window.scrollTo(0, 0);
  });

put this code on your controller. (Change the value as per your requirements)

1
  • 1
    I had to use $stateChangeSuccess but it worked well. Also used $window service for testability
    – Chic
    Commented Sep 30, 2015 at 18:13

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.