AngularJS中重新加载当前路由页面的方法


Posted in Javascript onMarch 09, 2018

这个问题同样困扰我很久,网上的回答五花八门,全都不能解决;终于在网上找很久,看到某大神的解决办法,整理作此分享;使用ui-router重新加载当前页面的问题。(ui-router版本需要是0.2.14以上的)

用angular做项目,会碰到需要点击菜单刷新当前页面,加载当前页面,但是同一个路由页面点击没反应;

假设我们的路由页面 app.toMenu ;

<a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" ui-sref="app.toMenu" ui-sref-opts="{reload:true}">
<!-- 网上普遍都说这样刷新,但这个是整个页面也同时都刷新了 -->

其实,reload除了可以传递布尔类型型参数,还可以传string和object型参数,如果只是想刷新当前的路由页面,而不去连带刷新父路由,我们可以把reload的参数值设置为当前路由页面标识。

<a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" ui-sref="app.toMenu" ui-sref-opts="{reload:'app.toMenu'}">
<!-- 这个方法刷新当前路由页面 -->

另外也可以用$state.reload();

$state.reload()是加载整个页面;

$state.reload('app.toMenu');加载当前页面;

<a href="" ng-click=" rel="external nofollow" reloadCurPage()">
<!-- controller里面 $scope -->
$scope.reloadCurPage = function(){
 $state.reload('app.toMenu');
}

注:如果标识是变量的话

<a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" ui-sref="{{k.value}}" ui-sref-opts="{reload:'{{k.value}}'}">

以上这篇AngularJS中重新加载当前路由页面的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js parentElement和offsetParent之间的区别
Mar 23 Javascript
jquery $.ajax各个事件执行顺序
Oct 15 Javascript
js处理自己不能定义二维数组的方法详解
Mar 03 Javascript
Javascript基础教程之switch语句
Jan 18 Javascript
JavaScript使用cookie实现记住账号密码功能
Apr 27 Javascript
bootstrap3 兼容IE8浏览器!
May 02 Javascript
利用原生js和jQuery实现单选框的勾选和取消操作的方法
Sep 04 Javascript
通过BootStrap实现轮播图的实际应用
Sep 26 Javascript
深入理解Vuex 模块化(module)
Sep 26 Javascript
微信小程序使用request网络请求操作实例
Dec 15 Javascript
vue中的$emit 与$on父子组件与兄弟组件的之间通信方式
May 13 Javascript
JS+HTML5实现获取手机验证码倒计时按钮
Aug 08 Javascript
vue.js 底部导航栏 一级路由显示 子路由不显示的解决方法
Mar 09 #Javascript
vue+element-ui+ajax实现一个表格的实例
Mar 09 #Javascript
使用live-server快速搭建本地服务器+自动刷新的方法
Mar 09 #Javascript
解决低版本的浏览器不支持es6的import问题
Mar 09 #Javascript
vuex实现登录状态的存储,未登录状态不允许浏览的方法
Mar 09 #Javascript
详解react关于事件绑定this的四种方式
Mar 09 #Javascript
vue+vuex+axios实现登录、注册页权限拦截
Mar 09 #Javascript
You might like
PHP生成UTF8文件的方法
2010/05/15 PHP
从康盛产品(discuz)提取出来的模板类
2011/06/28 PHP
PHP英文字母大小写转换函数小结
2014/05/03 PHP
linux下安装php的memcached客户端
2014/08/03 PHP
PHP中new static() 和 new self() 的区别介绍
2015/01/09 PHP
ubuntu下配置nginx+php+mysql详解
2015/09/10 PHP
Zend Framework+smarty用法实例详解
2016/03/19 PHP
PHP的Yii框架中View视图的使用进阶
2016/03/29 PHP
Javascript Global对象
2009/08/13 Javascript
IE与FireFox中的childNodes区别
2011/10/20 Javascript
javascript实现焦点滚动图效果 具体方法
2013/06/24 Javascript
js 时间函数应用加、减、比较、格式转换的示例代码
2013/08/23 Javascript
JS增加行复制行删除行的实现代码
2013/11/09 Javascript
js实现div闪烁原理及实现代码
2014/06/24 Javascript
jquery中animate的stop()方法作用实例分析
2015/01/30 Javascript
JS/Jquery判断对象为空的方法
2015/06/11 Javascript
详解JavaScript 中的 replace 方法
2016/01/01 Javascript
jQuery ui autocomplete选择列表被Bootstrap模态窗遮挡的完美解决方法
2016/09/23 Javascript
jQuery实现的仿百度,仿谷歌搜索下拉框效果示例
2016/12/30 Javascript
js学习总结_基于数据类型检测的四种方式(必看)
2017/07/04 Javascript
原生js中ajax访问的实例详解
2017/09/19 Javascript
vue使用$emit时,父组件无法监听到子组件的事件实例
2018/02/26 Javascript
微信小程序swiper左右扩展各显示一半代码实例
2019/12/05 Javascript
Python反射的用法实例分析
2018/02/11 Python
Python安装lz4-0.10.1遇到的坑
2018/05/20 Python
Python3.5多进程原理与用法实例分析
2019/04/05 Python
tensorflow 2.0模式下训练的模型转成 tf1.x 版本的pb模型实例
2020/06/22 Python
详解CSS3中border-image的使用
2015/07/18 HTML / CSS
美国家喻户晓的保健品品牌:Vitamin World(维他命世界)
2016/08/19 全球购物
美国护肤咨询及美容产品电商:Askderm
2017/02/24 全球购物
施华洛世奇西班牙官网:SWAROVSKI西班牙
2019/06/06 全球购物
教师现实表现材料
2014/02/14 职场文书
教育系统干部作风整顿心得体会
2014/09/09 职场文书
办公室文员岗位职责
2015/02/04 职场文书
高中教师个人总结
2015/02/10 职场文书
python 实现mysql自动增删分区的方法
2021/04/01 Python