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 相关文章推荐
Array对象方法参考
Oct 03 Javascript
精通JavaScript 纠正 cleanWhitespace函数
Mar 11 Javascript
jquery操作复选框(checkbox)的12个小技巧总结
Feb 04 Javascript
常用的几段javascript代码分享
Mar 25 Javascript
Javascript的表单验证-提交表单
Mar 18 Javascript
Node.js中如何合并两个复杂对象详解
Dec 31 Javascript
在js代码拼接dom对象到页面上去的模板总结(必看)
Feb 14 Javascript
VUE重点问题总结
Mar 19 Javascript
纯JS实现的读取excel文件内容功能示例【支持所有浏览器】
Jun 23 Javascript
你不知道的Vue技巧之--开发一个可以通过方法调用的组件(推荐)
Apr 15 Javascript
js实现转动骰子模型
Oct 24 Javascript
html+vue.js 实现漂亮分页功能可兼容IE
Nov 07 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
咖啡产品发展的三大浪潮
2021/03/04 咖啡文化
如何使用PHP获取网络上文件
2006/10/09 PHP
PHP多进程编程实例详解
2017/07/19 PHP
Extjs在exlipse中设置自动提示的方法
2010/04/07 Javascript
JavaScript 判断浏览器是否支持SVG的代码
2013/03/21 Javascript
JQuery中extend使用介绍
2014/03/13 Javascript
javascript实现锁定网页、密码解锁效果(类似系统屏幕保护效果)
2014/08/15 Javascript
深入探寻javascript定时器
2015/01/02 Javascript
EasyUi中的Combogrid 实现分页和动态搜索远程数据
2016/04/01 Javascript
jquery制做精致的倒计时特效
2016/06/13 Javascript
javascript入门之string对象【新手必看】
2016/11/22 Javascript
Node.js利用Net模块实现多人命令行聊天室的方法
2016/12/23 Javascript
jQuery插件FusionCharts绘制的2D帕累托图效果示例【附demo源码】
2017/03/28 jQuery
实现div滚动条默认最底部以及默认最右边的示例代码
2017/11/15 Javascript
vscode 开发Vue项目的方法步骤
2018/11/25 Javascript
vue.js基于v-for实现批量渲染 Json数组对象列表数据示例
2019/08/03 Javascript
JavaScript find()方法及返回数据实例
2020/04/30 Javascript
Node.js API详解之 module模块用法实例分析
2020/05/13 Javascript
ES2020系列之空值合并运算符 '??'
2020/07/22 Javascript
前端性能优化建议
2020/09/17 Javascript
[01:02:17]2014 DOTA2华西杯精英邀请赛 5 24 DK VS VG
2014/05/26 DOTA
Python检测生僻字的实现方法
2016/10/23 Python
python web.py开发httpserver解决跨域问题实例解析
2018/02/12 Python
python如何去除字符串中不想要的字符
2020/07/05 Python
HTML5 canvas基本绘图之绘制曲线
2016/06/27 HTML / CSS
俄罗斯玩具、儿童用品、儿童服装和鞋子网上商店:MyToys.ru
2019/10/14 全球购物
高校毕业生登记表自我鉴定
2013/11/03 职场文书
毕业生求职找工作的自我评价范文
2013/11/27 职场文书
班干部竞选演讲稿
2014/04/24 职场文书
高校优秀辅导员事迹材料
2014/05/07 职场文书
小学美术兴趣小组活动总结
2014/07/07 职场文书
企业法人授权委托书范本
2014/09/23 职场文书
新闻通讯稿范文
2015/07/22 职场文书
Django中session进行权限管理的使用
2021/07/09 Python
Redis入门基础常用操作命令整理
2022/06/01 Redis
Apache自带的ab压力测试工具的实现
2022/07/23 Servers