Slide view with angular ui-router and ng-animate auto scroll to target view

Question

I use AngularJS ui-routerand ngAnimateto create a classic sliding type mobile phone.

I found that at the beginning of the transition, when both views exist on the page, if the target view leaves the view port, it will first move to this view position, which will give us a funny effect:

plunker

Anyway, to avoid this?

Answer 1

Well, usually Angular uses $ anchorscroll to jump to a new view. This can be disabled by calling .value('$anchorScroll', angular.noop)on your module, for example:

var app = angular.module('app', [
        'ui.router',
        'ngAnimate'
    ]).value('$anchorScroll', angular.noop);

UI-Router . , UI-Router ( ) $anchorScroll: $uiViewScrollProvider.useAnchorScroll();

Answer 2

Angular UI-Router , , . . , ui-view:

<div ui-view="header"  autoscroll="false"></div>