我正在尝试使用带有路由器动画的Angular 8设计一个站点。我已经导入了BrowserAnimationsModule，并且确实看到了动画的某种程度。
我还使用Angular路由器的scrollPositionRestoration来确保当用户单击链接查看新页面时，显示的是新页面的顶部，而不是先前的滚动位置。
但是，当路由器将新组件加载到视图中时，在应用路由器动画时会突然将整个窗口滚动到最顶部。我尝试禁用scrollPositionRestoration属性，该属性的确摆脱了烦人的滚动，但是我的新页面是在上一个滚动位置而不是顶部加载的。
这是一个证明我的问题的懈怠：https://stackblitz.com/edit/angular-xpadeg。
要重新创建问题，请转到“关于”页面，向下滚动，然后单击“主页”链接，动画执行时将显示突然滚动。
答案 0 :(得分：0)
有两个问题需要解决：
滚动恢复将立即在下一个页面
窗口高度会突然改变（您会注意到滚动条的高度突然缩小/增长）
不幸的是，我之前已经经历过此过程，该解决方案包括禁用scrollPositionRestoration，收听NavigationStart, NavigationEnd, popstate，从“缓存”（{{1}页面和位置），并在动画开始时将Map应用于上一页页面（以使其保持原位，而不受下一个的恢复的影响）动画中的页面位置）
说实话，这是不值得的努力。我认为您最好在页面加载时在页面内容本身上应用position: fixed类型的 Component 动画。您可以通过这种方式启用fade in，而不必处理导航事件
我很确定当内容不可滚动时，最好使用路由动画