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 相关文章推荐
javascript-TreeView父子联动效果保持节点状态一致
Aug 12 Javascript
javascript与CSS复习(二)
Jun 29 Javascript
jquery文档操作wrap()方法实例简述
Jan 10 Javascript
javascript中var的重要性分析
Feb 11 Javascript
js实现微信/QQ直接跳转到支付宝APP打开口令领红包功能
Jan 09 Javascript
使用ECharts实现状态区间图
Oct 25 Javascript
创建Vue项目以及引入Iview的方法示例
Dec 03 Javascript
vue中$refs, $emit, $on, $once, $off的使用详解
May 26 Javascript
layui 选择列表,打勾,点击确定返回数据的例子
Sep 02 Javascript
实例分析JS中的相等性判断===、 ==和Object.is()
Nov 17 Javascript
逐行分析鸿蒙系统的 JavaScript 框架(推荐)
Sep 17 Javascript
JavaScript实现移动小精灵的案例代码
Dec 12 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
VFP与其他应用程序的集成
2006/10/09 PHP
PHP变量赋值、代入给JavaScript中的变量
2015/06/29 PHP
thinkPHP5.0框架安装教程
2017/03/25 PHP
PHP常见加密函数用法示例【crypt与md5】
2019/01/27 PHP
Fastest way to build an HTML string(拼装html字符串的最快方法)
2011/08/20 Javascript
用Jquery选择器计算table中的某一列某一行的合计
2014/08/13 Javascript
JS实现弹出居中的模式窗口示例
2016/06/20 Javascript
微信小程序 rpx 尺寸单位详细介绍
2016/10/13 Javascript
JavaScript获取URL参数的方法之一
2017/03/24 Javascript
使用vue-route 的 beforeEach 实现导航守卫(路由跳转前验证登录)功能
2018/03/22 Javascript
使用angular-cli webpack创建多个包的方法
2018/10/16 Javascript
JavaScript时间与时间戳的转换操作实例分析
2018/12/07 Javascript
解决layer弹出层自适应页面大小的问题
2019/09/16 Javascript
vue.js实现左边导航切换右边内容
2019/10/21 Javascript
Vue程序化的事件监听器(实例方案详解)
2020/01/07 Javascript
JavaScript中CreateTextFile函数
2020/08/30 Javascript
python通过文件头判断文件类型
2015/10/30 Python
详解python的几种标准输出重定向方式
2016/08/15 Python
用python的requests第三方模块抓取王者荣耀所有英雄的皮肤实例
2017/12/14 Python
python实现汉诺塔算法
2021/03/01 Python
使用python画社交网络图实例代码
2019/07/10 Python
浅谈pytorch grad_fn以及权重梯度不更新的问题
2019/08/20 Python
python tornado修改log输出方式
2019/11/18 Python
python能否java成为主流语言吗
2020/06/22 Python
python实现自动清理重复文件
2020/08/24 Python
PurCotton全棉时代官网:100%天然棉花生产的生活护理用品
2016/11/18 全球购物
欧洲著名的珠宝和手表网上商城:uhrcenter
2017/04/10 全球购物
Foot Locker英国官网:美国知名运动产品零售商
2019/02/21 全球购物
英国领先的在线高尔夫商店:Gamola Golf
2019/11/16 全球购物
离职证明标准格式
2014/09/15 职场文书
谢师宴学生致辞
2015/07/27 职场文书
忠诚教育学习心得体会
2016/01/23 职场文书
青年岗位能手事迹材料(2016推荐版)
2016/03/01 职场文书
Flask搭建一个API服务器的步骤
2021/05/28 Python
上个世纪50年代的可穿戴技术:无线电帽子
2022/02/18 无线电
解决Git推送错误non-fast-forward的方法
2022/06/25 Servers