程序员经验分享-hwhale

更改路线不会滚动到新页面的顶部

2024-03-20

当路线改变时，我发现了一些不受欢迎的行为，至少对我来说是这样。 在教程的第11步中http://angular.github.io/angular-phonecat/step-11/app/#/phones http://angular.github.io/angular-phonecat/step-11/app/#/phones您可以看到电话列表。如果您滚动到底部并单击最新的一项，您可以看到滚动条不在顶部，而是在中间。

我也在我的一个应用程序中找到了这个，我想知道如何让它滚动到顶部。我可以手动执行此操作，但我认为应该有其他优雅的方法来执行此操作，但我不知道。

那么，有没有一种优雅的方式在路线改变时滚动到顶部呢？


问题是你的ngView加载新视图时保留滚动位置。您可以指导$anchorScroll“视图更新后滚动视口”（docs https://docs.angularjs.org/api/ngRoute/directive/ngView有点模糊，但滚动到这里意味着滚动到顶部新视图）。

解决方案是添加autoscroll="true"到你的 ngView 元素：

<div class="ng-view" autoscroll="true"></div>
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

javascript

angularJS

scroll

angularjsrouting

更改路线不会滚动到新页面的顶部 的相关文章

随机推荐

  • 如何在 MySQL *Prepared* 存储过程中使用多个参数

    尽管有一些在 MySQL 存储过程中使用多个参数的很好的示例 但我一直无法找到一个简单的示例来说明如何在存储过程中使用它们prepared 下面的代码返回 Incorrect arguments to EXECUTE 使用以下方式调用它时

  • 我如何知道谁调用了 System.gc()？

    在正在运行的系统中 我们会看到很多 Full GC System 这表明有人触发了 System gc 有没有办法找出代码中发生这种情况的位置 我确实搜索了所有可用的源 但没有发现任何可疑的东西 因此它一定在某个地方 可能是在同一容器或容器

  • django隐藏所有表单错误

    有没有办法向用户隐藏所有表单错误消息 我显示自己的消息 而错误消息显示在表单字段之间的事实对我来说没有用 您可以自己渲染模板 并忽略错误 请参阅文档自定义表单模板 https docs djangoproject com en dev to

  • PySpark NoSuchMethodError：将数据插入数据库时​​sun.nio.ch.DirectBuffer.cleaner

    我在尝试将大型数据帧插入 Postgres 时收到此错误 NoSuchMethodError sun nio ch DirectBuffer cleaner 这是一个完整的错误 之前有很多操作 所以没有理由将它们附加到问题中 您能否给一些建

  • Lambda“if”语句？

    我有 2 个对象 我想将它们转换为字典 我使用 toDictionary 一个对象获取密钥的 lambda 表达式是 i gt i name 对于另一个 它是 i gt i inner name 在第二个中 i name 不存在 如果 i

  • 如何使用 mvvm 禁用文本块？

    如何使用 mvvm 禁用文本块 我对我尝试过的这种架构很陌生IsEnabled Binding IsEnable i e XAML

  • 如何仅使用javascript在短时间内更改点击时的按钮文本？

    我正在制作一个购物车网站 我想要我的添加到购物车按钮说添加项目单击它后 但只持续大约 2 秒 然后它会变回添加到购物车 我该如何实现这一目标 在纯 JavaScript 中 您可以使用变量来检查按钮是否被单击 如果没有 则将按钮设置为所需的

  • 在 Power BI/Power Query 中添加缺失的日期行并获取上面行的值

    假设我正在将以下内容导入 PowerBI Date Quantity 1 1 2018 22 1 3 2018 30 1 4 2018 10 其中外部源表是一系列日期 值行 其中缺少一些日期值 我想执行一些 DAX M 将任何缺失的日期行添

  • 如何通过 VBA 从 javascript 计算 vbscript 表达式

    最新的 MS Office 更新禁用了 vbscript 我在 Excel VBA 中使用它来计算表达式 我发现这比过去的 VBA 评估 功能要快得多 因此希望避免这样做 Javascript 仍然可以工作 所以我正在尝试迁移到它 然而 我

  • where 子句中的 LINQ to Nhibernate 用户定义函数

    我正在尝试执行以下操作 var query from a in session Query a where a BasicSearch searchString true select a 但它一直给我这个异常 System NotSupp

  • 如何在 PostgreSQL 查询中显示行号？

    我想显示 PostgreSQL 查询返回的每条记录的观察数 我认为 8 4 窗口函数可以执行此功能 select row number over order by

  • 通过 Windows API 解码 PKCS#7 签名？

    我希望解析并显示从 Window PE 二进制文件的安全目录中提取的 Authenticode PKCS 7 签名的内容 我可以使用 OpenSSL 在命令行上执行此操作 openssl pkcs7 text in extracted si

  • Java 1.6 中的 Try-with-resources 等效项

    我有以下代码 public class Main public static void main String args throws SQLException try Connection conn DBUtil getConnectio

  • React 中的 setInterval 和 setState

    我有一个计时器使用setInterval 在 React 组件中 我不确定启动和停止此间隔的最佳实践是什么state 我遇到了一些异步问题 假设我的 React 组件中有一组链接可以很好地渲染和执行回调 let links 10 50 10

  • “无法读取未定义的属性‘加载’”

    我正在尝试遵循this https developers google com identity sign in web devconsole project与 Google 登录集成的文档 尽管我在控制台中遇到了此错误 Uncaught

  • async/await forEach 和 Promise.all + map 有什么区别

    In 类似问题的接受答案 https stackoverflow com a 37576787 12458473答案指出forEach调用只是抛出一个承诺然后退出 我认为情况应该是这样forEach回报undefined但是为什么下面的代码

  • atexit 被认为有害吗？

    使用是否存在固有的危险atexit在图书馆等大型项目中 如果是这样 背后的技术本质是什么 atexit这可能会导致大型项目出现问题 我避免使用的主要原因atexit在图书馆中 它的任何使用都涉及全局状态 一个好的库应该避免拥有全局状态 然而

  • 在 vue 组件的模板 html 中启用智能感知需要什么？

    我对 Vue 比较陌生 但精通 Typescript 和 Angular 我目前正在走打字稿路线 使用vue 类组件 https github com vuejs vue class component and vue 属性装饰器 http

  • 无法访问 Django 服务器 http://127.0.0.1:8000/

    第一次它工作得很好 但现在显示了这个问题 app python manage py runserver Performing system checks System check identified no issues 0 silence

  • 更改路线不会滚动到新页面的顶部

    当路线改变时 我发现了一些不受欢迎的行为 至少对我来说是这样 在教程的第11步中http angular github io angular phonecat step 11 app phones http angular github i

热门标签