使用 ui-router 和 Angularjs 自动滚动到 TOP [英] Autoscroll to TOP with ui-router and Angularjs

查看:22
本文介绍了使用 ui-router 和 Angularjs 自动滚动到 TOP的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我已经阅读了很多不同的问题,但给出的解决方案似乎都不适合我的用例.我开始简单地将 target="_top" 放在我所有的链接上,但这实际上迫使我的应用程序重新加载,这将不起作用.我也看到有人说他们使用 autoscroll="true" 但这似乎只有在我的 ui-view 中才有效.

I've read so many different problems with this and none of the solution given seem to fit my use case. I started by simply putting target="_top" on all my links, but that actually forces my app to reload which wont work. I've also seen people say they use autoscroll="true" but that only seems to work if its within my ui-view.

问题在于,在我的 index.html 文件中,我修复了导航和其他静态元素,这些元素位于我的第一个 ui 视图之上.这意味着当我转到其他页面时,当页面加载通过这些元素时,我会丢失导航.我也试过把它放在身体上:

The issue with this is that in my index.html file I have fixed nav and other static elements that are above my first ui-view. This means when I go to other pages I lose the navigation as the page loads past those elements. I've also tried putting this on the body with:

<body autoscroll="true">
</body>

这似乎也没有任何作用.所以问题是,如何确保新页面(来自 ui-router 的新路由更改)导致从页面顶部开始?谢谢!

This doesn't seem to do anything either. So the question is, how can I make sure that new pages (new route changes from ui-router) result in starting at the top of the page? THANKS!

推荐答案

如果您希望它始终跨浏览器滚动到 0,请不要使用自动滚动.只需将其放置在您的运行块中即可:

If you want it to always scroll to 0 cross-browser, do nothing with autoscroll. Just place this your run block:

$rootScope.$on('$stateChangeSuccess', function() {
   document.body.scrollTop = document.documentElement.scrollTop = 0;
});

这篇关于使用 ui-router 和 Angularjs 自动滚动到 TOP的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆