编程 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 相关文章推荐

js cookies实现简单统计访问次数

Nov 24 Javascript

JavaScript数组对象赋值用法实例

Aug 04 Javascript

去除字符串左右两边的空格(实现代码)

May 12 Javascript

浅谈JavaScript中的分支结构

Jul 01 Javascript

jQuery实现底部浮动窗口效果

Sep 07 Javascript

鼠标经过出现气泡框的简单实例

Mar 17 Javascript

Angular.JS去掉访问路径URL中的#号详解

Mar 30 Javascript

AngularJS日程表案例详解

Aug 15 Javascript

详解最新vue-cli 2.9.1的webpack存在问题

Dec 16 Javascript

vue路由导航守卫和请求拦截以及基于node的token认证的方法

Apr 07 Javascript

Vue + Elementui实现多标签页共存的方法

Jun 12 Javascript

JsonServer安装及启动过程图解

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

php文章内容分页并生成相应的htm静态页面代码

2010/06/07 PHP

PHP 微信扫码支付源代码(推荐)

2016/11/03 PHP

js精度溢出解决方案

2012/12/02 Javascript

Js 时间函数getYear()的使用问题探讨

2013/04/01 Javascript

jquery阻止后续事件只执行第一个事件

2014/07/24 Javascript

再谈JavaScript线程

2015/07/10 Javascript

JS实现来回出现文字的状态栏特效代码

2015/10/31 Javascript

Javascript基础_简单比较undefined和null 值

2016/06/14 Javascript

javascript跨域请求包装函数与用法示例

2016/11/03 Javascript

javascript防篡改对象实例详解

2017/04/10 Javascript

详解Vue开发微信H5微信分享签名失败问题解决方案

2018/08/09 Javascript

详解Vue依赖收集引发的问题

2019/04/22 Javascript

[01:10]3.19DOTA2发布会三代刀塔人第一代

2014/03/25 DOTA

python使用正则表达式匹配字符串开头并打印示例

2017/01/11 Python

给你选择Python语言实现机器学习算法的三大理由

2017/11/15 Python

Python数据分析之双色球统计单个红和蓝球哪个比例高的方法

2018/02/03 Python

pycharm重置设置,恢复默认设置的方法

2018/10/22 Python

Python实现简单石头剪刀布游戏

2021/01/20 Python

Python实现socket非阻塞通讯功能示例

2019/11/06 Python

PyTorch里面的torch.nn.Parameter()详解

2020/01/03 Python

Win 10下Anaconda虚拟环境的教程

2020/05/18 Python

基于Python爬取京东双十一商品价格曲线

2020/10/23 Python

关于HTML5你必须知道的28个新特性,新技巧以及新技术

2012/05/28 HTML / CSS

银行毕业实习自我鉴定

2013/09/19 职场文书

汽车销售顾问求职自荐信

2014/01/01 职场文书

优秀团队获奖感言

2014/02/19 职场文书

幼儿发展评估方案

2014/06/11 职场文书

人事行政专员岗位职责

2014/07/23 职场文书

法定代表人授权委托书范文

2014/09/22 职场文书

自荐信怎么写

2015/03/04 职场文书

2016年过年放假安排通知

2015/08/18 职场文书

《草虫的村落》教学反思

2016/02/20 职场文书

创业计划之特色精品店

2019/08/12 职场文书

写一个Python脚本自动爬取Bilibili小视频

2021/04/24 Python

golang DNS服务器的简单实现操作

2021/04/30 Golang

SpringBoot整合RabbitMQ的5种模式实战

2021/08/02 Java/Android