Smooth scrolling for autoscrolling in UI-Router

Question

Is there a way to get the ui-router autoscroll functionality with smooth scrolling, and not immediately jump to this place?

Or is there a way to add an eventlistener to all the states that were fired when the state was changed so that I am accessing the ui-view element?

Answer 1

Something like this should work. You may need to configure target.offset (). A little up if you have a fixed header or something similar that could ruin the offset.

 app.config(function ($provide) { $provide.decorator('$uiViewScroll', function ($delegate) { return function (uiViewElement) { $('html,body').animate({ scrollTop: uiViewElement.offset().top }, 500); }; }); }); 

Keep autoscroll="true" in your ui-view.

See another answer for a loan on prodiver: Angular ui-router scroll up, not in ui-view .