angularjs 路由切换回到顶部
angularjs路由切换 页面不会回到顶部
问题:
在angularjs中 ui-sref或者$state.go(),通过路由切换页面,发现新打开的路由页面仍然停留在上一次的路由页面访问的位置。
解决方式:
通过网上搜索,发现有通过 autoscroll="true"实现的,确实这项配置可以使得新打开的路由页面回到当前路由块的顶部,而不会满足我回到网页的顶部。如果在开发过程中遇到这种切换路由回到网页顶部或者其他位置的情况该怎么解决呢?
最终通过路由变化监控实现如下:
artApp.run(['$rootScope', '$state', function ($rootScope, $state){
$rootScope.$on('$stateChangeSuccess',
function(event, unfoundState, fromState, fromParams){
document.body.scrollTop = document.documentElement.scrollTop = 0;
}
);
}]);
angularjs 路由切换回到顶部的更多相关文章
- vue路由切换时内容组件的滚动条回到顶部
在使用vue的时候会出现切换路由的时候滚动条保持在原来的位置,要切换路由的时候滚动条回到顶部才有更好的用户体验 1.当页面整体都要滚动到顶部的情况 router.afterEach(() => ...
- 关于angular跳转路由之后不能自动回到顶部的解决方法
Question: angular2 scroll top on router change 当我们在第一个路由滑动到底部当我们点击导航跳转到另一个路由时页面没有回到顶部而是保持上一个路由的滚动位置, ...
- angularjs 水平滚动选中按钮高亮显示 swiper和回到顶部指令的实现ionic
首先安装 swiper npm install --save swiper 或者 bower install --save swiper <link rel="stylesheet&q ...
- vue开发 回到顶部操作
第一种:使用vue-router history 模式下,用scrollBehavior 方法实现. 1 export default new Router({ 2 mode: 'history', ...
- Angularjs路由需要了解的那点事
Angularjs路由需要了解的那点事 我们知道angularjs是特别适合单页面应用,为了通过单页面完成复杂的业务功能,势必需要能够从一个视图跳转到另外一个视图,也就是需要在单个页面里边加载不同的模 ...
- vue 2.0 路由切换以及组件缓存源代码重点难点分析
摘要 关于vue 2.0源代码分析,已经有不少文档分析功能代码段比如watcher,history,vnode等,但没有一个是分析重点难点的,没有一个是分析大命题的,比如执行router.push之后 ...
- AngularJS 路由 resolve属性
当路由切换的时候,被路由的页面中的元素(标签)就会立马显示出来,同时,数据会被准备好并呈现出来.但是注意,数据和元素并不是同步的,在没有任何设置的情况下,AngularJS默认先呈现出元素,而后再呈现 ...
- [AngularJS] “路由”的定义概念、使用详解——AngularJS学习资料教程
这是小编的一些学习资料,理论上只是为了自己以后学习需要的,但是还是需要认真对待的 以下内容仅供参考,请慎重使用学习 AngularJS“路由”的定义概念 AngularJS最近真的很火,很多同事啊同学 ...
- angularjs -- 路由监听
前几天,项目在做一个功能时需要在页面切换之前关闭正在执行的函数.尝试了几种方式都不行,最后想到既然angularjs是通过理由切换页面,那就在路由上面做文章吧.AngularJS在路由发生改变时,可以 ...
随机推荐
- JS中由闭包引发内存泄露的深思
目录 一个存在内存泄露的闭包实例 什么是内存泄露 JS的垃圾回收机制 什么是闭包 什么原因导致了内存泄露 参考 1.一个存在内存泄露的闭包实例 var theThing = null; var rep ...
- Linux服务器有大量的TIME_WAIT状态
我们经常会遇到在服务器上看到大量的TIME_WAIT,它们占用进程不释放,最后会导致所有进程数被耗完,服务器负载增高等生产事故,具体是什么原因导致的呢?我们先来看看TCP的三次握手四次挥手都是怎样的一 ...
- golang之method
method Go does not have classes. However, you can define methods on types. package main import ( &qu ...
- thinkphp日志泄露扫描
import requests,sys dirpath=[] def dirscan(url,year): for i in range(1,13): if i < 10: urls=url+' ...
- 第一个Vue-cli
第一步下载node.js https://nodejs.org/zh-cn/ 安装成功后 在cmd 输入 node -v 看看能不能打印出来 在cmd 输入 nmp-v 看看能不能打印出来 全局安装 ...
- MySQL 主从复制原理及过程讲解
mysql主从原理描述,摘自老男孩. 下面简 单描述下 MySQL Replication 复制的原理及过程 . 1.在 Slave 服务器上执行 start slave 命令开启主从复制开关,主从复 ...
- LeetCode最长回文子串
题目: 给定一个字符串 s,找到 s 中最长的回文子串.你可以假设 s 的最大长度为 1000. 示例 1: 输入: "babad"输出: "bab"注意: & ...
- javascript实现checkbox提交submit请求
javascript实现checkbox提交submit请求 背景:使用django模板中for来形成多个checkbox,需要点击单个checkbox并查询数据触发submit请求到后台,djang ...
- HDU 2004 (水)
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=2004 题目大意: 给你成绩让你根据成绩打分解题思路: 简单的if...else 应用 需要注意是,if ...
- 热修复框架Tinker快速集成
由于腾讯官方的demo对于刚接触的我来说,太过复杂,找不到核心配置,因此将tinker集成中最核心的东西抽取出来,整合到一个demo中. demo工程已经提交到github上,点击跳转 更多使用方法, ...