编程 Javascript

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

Posted in Javascript onAugust 30, 2016

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

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

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

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

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

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

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

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

- Author -

紫日残月

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

用javascript实现页面打印的三种方法

Mar 05 Javascript

jQuery 表单验证扩展代码(一)

Oct 11 Javascript

js获得指定控件输入光标的坐标兼容IE,Chrome,火狐等多种主流浏览器

May 21 Javascript

jquery垂直公告滚动实现代码

Dec 08 Javascript

FireBug 调试JS入门教程如何调试JS

Dec 23 Javascript

Javascript中call与apply的学习笔记

Sep 22 Javascript

javascript中html字符串转化为jquery dom对象的方法

Aug 27 Javascript

jquery实现Slide Out Navigation滑出式菜单效果代码

Sep 07 Javascript

关于Node.js的events.EventEmitter用法介绍

Apr 01 Javascript

JavaScript原型链与继承操作实例总结

Aug 24 Javascript

Vue2.5学习笔记之如何在项目中使用和配置Vue

Sep 26 Javascript

vue el-upload上传文件的示例代码

Dec 21 Vue.js

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

PHP 实现多服务器共享 SESSION 数据

2009/08/15 PHP

php颜色转换函数hex-rgb(将十六进制格式转成十进制格式)

2013/09/23 PHP

PHP中localeconv()函数的用法

2019/03/26 PHP

PHP判断函数是否被定义的方法

2019/06/21 PHP

tp5.1 框架数据库高级查询技巧实例总结

2020/05/25 PHP

父子窗体间传递JSON格式的数据的代码

2010/12/25 Javascript

jQuery中bind()方法用法实例

2015/01/19 Javascript

jquery中change()用法实例分析

2015/02/06 Javascript

js+html5通过canvas指定开始和结束点绘制线条的方法

2015/06/05 Javascript

AngularJs bootstrap搭载前台框架——基础页面

2016/09/01 Javascript

js实现右键自定义菜单

2016/12/03 Javascript

jQuery UI仿淘宝搜索下拉列表功能

2017/01/10 Javascript

Vue指令的钩子函数使用方法

2017/03/20 Javascript

JS实现简单的浮动碰撞效果示例

2017/12/28 Javascript

Angular入口组件（entry component）与声明式组件的区别详解

2018/04/09 Javascript

JS中比较两个Object数组是否相等方法实例

2019/11/11 Javascript

JavaScript实现动态生成表格

2020/08/02 Javascript

[02:38]2018DOTA2亚洲邀请赛赛前采访-VGJ.T

2018/04/03 DOTA

python实现通过shelve修改对象实例

2014/09/26 Python

python脚本替换指定行实现步骤

2017/07/11 Python

使用实现XlsxWriter创建Excel文件并编辑

2018/05/04 Python

Python3实现的Mysql数据库操作封装类

2018/06/06 Python

与Django结合利用模型对上传图片预测的实例详解

2019/08/07 Python

Python全栈之列表数据类型详解

2019/10/01 Python

Python阶乘求和的代码详解

2020/02/14 Python

运动会致辞稿50字

2014/02/04 职场文书

食品业务员岗位职责

2014/03/18 职场文书

竞聘上岗演讲稿

2014/05/16 职场文书

化工工艺设计求职信

2014/06/25 职场文书

纪检干部现实表现材料

2014/08/21 职场文书

论文答谢词

2015/01/20 职场文书

社区志愿服务活动感想

2015/08/07 职场文书

《扇形统计图》教学反思

2016/02/17 职场文书

redis哨兵常用命令和监控示例详解

2021/05/27 Redis

MySQL时区造成时差问题

2022/04/13 MySQL

ant design charts 获取后端接口数据展示

2022/05/25 Javascript