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 相关文章推荐
利用ASP发送和接收XML数据的处理方法与代码
Nov 13 Javascript
基于jQuery的message插件实现右下角弹出消息框
Jan 11 Javascript
js中判断文本框是否为空的两种方法
Jul 31 Javascript
去掉gridPanel表头全选框的小例子
Jul 18 Javascript
js鼠标及对象坐标控制属性详细解析
Dec 14 Javascript
在JavaScript中操作时间之getMonth()方法的使用
Jun 10 Javascript
BootStrap实用代码片段之一
Mar 22 Javascript
使用JS获取页面上的所有标签
Oct 18 Javascript
layui的layedit富文本赋值方法
Sep 18 Javascript
微信小程序本地存储实现每日签到、连续签到功能
Oct 09 Javascript
Laravel 如何在blade文件中使用Vue组件的示例代码
Jun 28 Javascript
详解Javascript实践中的命令模式
May 05 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+ajax实现无刷新动态加载数据技术
2015/04/28 PHP
php实现通过cookie换肤的方法
2015/07/13 PHP
php unlink()函数使用教程
2018/07/12 PHP
JavaScript Cookie的读取和写入函数
2009/12/08 Javascript
使用JavaScript构建JSON格式字符串实现步骤
2013/03/22 Javascript
表单类各种类型(文本框)失去焦点效果jquery代码
2013/04/26 Javascript
jQuery中ajax和post处理json的不同示例对比
2014/11/02 Javascript
jQuery实现折线图的方法
2015/02/28 Javascript
javascript控制台详解
2015/06/25 Javascript
javascript日期格式化方法小结
2015/12/17 Javascript
jQuery技巧之让任何组件都支持类似DOM的事件管理
2016/04/05 Javascript
JavaScript面试开发常用的知识点总结
2016/08/08 Javascript
浅谈jQuery this和$(this)的区别及获取$(this)子元素对象的方法
2016/11/29 Javascript
Vue2.x中的Render函数详解
2017/05/30 Javascript
jquery网页加载进度条的实现
2017/06/01 jQuery
vue 自定义 select内置组件
2018/04/10 Javascript
JavaScript解析及序列化JSON的方法实例分析
2019/01/04 Javascript
create-react-app中添加less支持的实现
2019/11/15 Javascript
[01:07:02]DOTA2-DPC中国联赛 正赛 iG vs PSG.LGD BO3 第三场 2月26日
2021/03/11 DOTA
Python urllib模块urlopen()与urlretrieve()详解
2013/11/01 Python
python绘图库Matplotlib的安装
2014/07/03 Python
python实现应用程序在右键菜单中添加打开方式功能
2017/01/09 Python
深入浅出学习python装饰器
2017/09/29 Python
python处理大日志文件
2019/07/23 Python
Django Rest framework解析器和渲染器详解
2019/07/25 Python
关于Numpy中的行向量和列向量详解
2019/11/30 Python
pandas-resample按时间聚合实例
2019/12/27 Python
python使用SQLAlchemy操作MySQL
2020/01/02 Python
python3实现名片管理系统(控制台版)
2020/11/29 Python
英国书籍、CD、DVD和游戏的第一道德零售商:Awesome Books
2020/02/22 全球购物
珍珠奶茶店创业计划书
2014/01/11 职场文书
《去年的树》教学反思
2014/04/11 职场文书
中学教师师德师风演讲稿
2014/08/22 职场文书
八项规定对照检查材料
2014/08/31 职场文书
2014年学习厉行节约反对浪费思想汇报
2014/09/10 职场文书
2015年学习部工作总结范文
2015/03/31 职场文书