Angular懒加载机制刷新后无法回退的快速解决方法


Posted in Javascript onAugust 30, 2016

今天在项目中遇到一个很奇怪的问题,使用oclazyload懒加载angular的模块,刷新页面后,单击回退按钮无法返回上一个页面.估计是使用懒加载机制销毁了angular内部的state关联,导致无法回到上一个state(单击回退按钮 ui-routre的 $stateChangeStart 事件都不会触发),当然这只是猜测,由于事件关系也没有去深入的探究源码.

angular懒加载机制刷新后无法回退的解决方案 :

通过查看angular(ionic)的源码发现$browser这个服务上有个onUrlChange方法,当我们从angular外部改变url地址时,会调用此方法中注册的事件处理函数,如下图所示:

Angular懒加载机制刷新后无法回退的快速解决方法

这样的话,就可以在程序入口注册一个函数

//当通过浏览器回退/前进按钮跳转state时,重新加载页面,如果用系统state,则不会进入此方法 
$browser.onUrlChange(function (url) { 
//TODO 解析url中的state,使用懒加载去加载state模块,实现页面刷新
});

通过这个函数就可以在回退和前进的时候重新去刷新页面了...

以上所述是小编给大家介绍的Angular懒加载机制刷新后无法回退的快速解决方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
JavaScript的面向对象(二)
Nov 09 Javascript
textarea焦点的用法实现获取焦点清空失去焦点提示效果
May 19 Javascript
jquery实现Slide Out Navigation滑出式菜单效果代码
Sep 07 Javascript
WordPress中鼠标悬停显示和隐藏评论及引用按钮的实现
Jan 12 Javascript
使用BootStrap实现用户登录界面UI
Aug 10 Javascript
AngularJS入门教程之模块化操作用法示例
Nov 02 Javascript
关于微信jssdk实现多图片上传的一点心得分享
Dec 13 Javascript
微信小程序 登录实例详解
Jan 16 Javascript
EasyUI中的dataGrid的行内编辑
Jun 22 Javascript
深入理解Promise.all
Aug 08 Javascript
Vue监听数据渲染DOM完以后执行某个函数详解
Sep 11 Javascript
JS浅拷贝和深拷贝原理与实现方法分析
Feb 28 Javascript
AngularJS 实现弹性盒子布局的方法
Aug 30 #Javascript
浅谈javascript中的Function和Arguments
Aug 30 #Javascript
javascript 中的console.log和弹出窗口alert
Aug 30 #Javascript
Laravel中常见的错误与解决方法小结
Aug 30 #Javascript
js中常用的Tab切换效果(推荐)
Aug 30 #Javascript
基于cssSlidy.js插件实现响应式手机图片轮播效果
Aug 30 #Javascript
JavaScript探测CSS动画是否已经完成的方法
Aug 30 #Javascript
You might like
6种php上传图片重命名的方法实例
2013/11/04 PHP
php实现的单一入口应用程序实例分析
2015/09/23 PHP
PHP实现计算器小功能
2020/08/28 PHP
音乐播放用的的几个函数
2006/09/07 Javascript
js改变img标签的src属性在IE下没反应的解决方法
2013/07/23 Javascript
js动态往表格的td中添加图片并注册事件
2014/06/12 Javascript
20条学习javascript的编程规范的建议
2014/11/28 Javascript
js控制元素显示在屏幕固定位置及监听屏幕高度变化的方法
2015/08/11 Javascript
Bootstrap框架安装使用详解
2017/01/21 Javascript
js实现随机数字字母验证码
2017/06/19 Javascript
详解vue-cli@2.x项目迁移日志
2019/06/06 Javascript
node实现简单的增删改查接口实例代码
2019/08/22 Javascript
vue使用原生swiper代码实例
2020/02/05 Javascript
jquery实现淡入淡出轮播图效果
2020/12/13 jQuery
Python设计模式之单例模式实例
2014/04/26 Python
给Python初学者的一些编程技巧
2015/04/03 Python
python 判断linux进程,并杀死进程的实现方法
2019/07/01 Python
python 进程间数据共享multiProcess.Manger实现解析
2019/09/23 Python
Python3.7基于hashlib和Crypto实现加签验签功能(实例代码)
2019/12/04 Python
PyTorch实现ResNet50、ResNet101和ResNet152示例
2020/01/14 Python
Python 中@property的用法详解
2020/01/15 Python
解析python 类方法、对象方法、静态方法
2020/08/15 Python
python 实现围棋游戏(纯tkinter gui)
2020/11/13 Python
jupyter notebook远程访问不了的问题解决方法
2021/01/11 Python
浅谈three.js中的needsUpdate的应用
2012/11/12 HTML / CSS
HTML5手指下滑弹出负一屏阻止移动端浏览器内置下拉刷新功能的实现代码
2020/04/10 HTML / CSS
应届生的求职推荐信范文
2013/11/30 职场文书
家长学校工作方案
2014/05/07 职场文书
保护环境的标语
2014/06/09 职场文书
装修施工安全责任书
2014/07/24 职场文书
党员剖析材料范文
2014/12/18 职场文书
2015个人半年总结范文
2015/03/09 职场文书
茶花女读书笔记
2015/06/29 职场文书
2019年作为一名实习生的述职报告
2019/09/29 职场文书
ajax请求前端跨域问题原因及解决方案
2021/10/16 Javascript
教你使用Ubuntu搭建DNS服务器
2022/09/23 Servers