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 相关文章推荐
Jquery ajax传递复杂参数给WebService的实现代码
Aug 08 Javascript
js jquery获取随机生成id的服务器控件的三种方法
Jul 11 Javascript
Jquery中children与find之间的区别详细解析
Nov 29 Javascript
javascript实现获取cookie过期时间的变通方法
Aug 14 Javascript
angularjs基础教程
Dec 25 Javascript
Javascript实现的Map集合工具类完整实例
Jul 31 Javascript
JS实现仿PS的调色板效果完整实例
Dec 21 Javascript
Angular排序实例详解
Jun 28 Javascript
jQuery实现的回车触发按钮事件功能示例
Mar 25 jQuery
JS数组去重的6种方法完整实例
Dec 08 Javascript
vue操作动画的记录animate.css实例代码
Apr 26 Javascript
vue中改变滚动条样式的方法
Mar 03 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
PHP4中session登录页面的应用
2008/07/25 PHP
php获取当前url地址的方法小结
2017/01/10 PHP
Javascript中的Split使用方法与技巧
2007/03/09 Javascript
javascript优先加载笔记代码
2008/09/30 Javascript
javascript forEach通用循环遍历方法
2010/10/11 Javascript
jQuery 在光标定位的地方插入文字的插件
2012/05/10 Javascript
使用jquery hover事件实现表格的隔行换色功能示例
2013/09/03 Javascript
jQuery在iframe中无法弹出对话框的解决方法
2014/01/12 Javascript
2014年50个程序员最适用的免费JQuery插件
2014/12/15 Javascript
JS实现带有抽屉效果的产品类网站多级导航菜单代码
2015/09/15 Javascript
理解JavaScript事件对象
2016/01/25 Javascript
通用无限极下拉菜单的实现代码
2016/05/31 Javascript
JS 获取HTML标签内的子节点的方法
2016/09/21 Javascript
微信小程序 闭包写法详细介绍
2016/12/14 Javascript
完美解决input[type=number]无法显示非数字字符的问题
2017/02/28 Javascript
微信小程序App生命周期详解
2018/01/31 Javascript
zTree 树插件实现全国五级地区点击后加载的示例
2018/02/05 Javascript
js捆绑TypeScript声明文件的方法教程
2018/04/13 Javascript
Js经典案例的实例代码
2018/05/10 Javascript
基于vue和websocket的多人在线聊天室
2020/02/01 Javascript
vue 移动端记录页面浏览位置的方法
2020/03/11 Javascript
python进阶教程之循环相关函数range、enumerate、zip
2014/08/30 Python
DataFrame 将某列数据转为数组的方法
2018/04/13 Python
用python处理图片之打开\显示\保存图像的方法
2018/05/04 Python
Python 数据库操作 SQLAlchemy的示例代码
2019/02/18 Python
Python分割训练集和测试集的方法示例
2019/09/19 Python
基于Python实现拆分和合并GIF动态图
2019/10/22 Python
关于Python中定制类的比较运算实例
2019/12/19 Python
python实现从ftp上下载文件的实例方法
2020/07/19 Python
HTML5 Canvas——用路径描画线条实例介绍
2013/06/09 HTML / CSS
阿里巴巴英国:Alibaba英国
2019/12/11 全球购物
新闻记者个人求职的自我评价
2013/11/28 职场文书
2014年科室工作总结范文
2014/12/19 职场文书
肖申克的救赎观后感
2015/06/02 职场文书
2015党建工作简报
2015/07/21 职场文书
停车场管理制度范本
2015/08/05 职场文书