angularjs路由菜单强制刷新
在开发过程中遇到使用路由控制单页加载页面时,点击菜单页面不重新刷新的情况,angularjs认为路由没有变化,而不会去刷新页面,解决办法:
angular.module('myApp').directive('diHref', ['$location', '$route',
function($location, $route) {
return function(scope, element, attrs) {
scope.$watch('diHref', function() {
if(attrs.diHref) {
element.attr('href', attrs.diHref);
element.bind('click', function(event) {
scope.$apply(function(){
if($location.path() == attrs.diHref) $route.reload();
});
});
}
});
}
}]);
这样在a标签中使用定义的指令,即可以实现强制刷新的要求
<a di-href="/action0001" >home</a>
angularjs路由菜单强制刷新的更多相关文章
- AngularJS路由系列(2)--刷新、查看路由,路由事件和URL格式,获取路由参数,路由的Resolve
本系列探寻AngularJS的路由机制,在WebStorm下开发.主要包括: ● 刷新路由● 查看当前路由以及所有路由● 路由触发事件● 获取路由参数 ● 路由的resolve属性● 路由URL格式 ...
- AngularJS路由系列(6)-- UI-Router的嵌套State
本系列探寻AngularJS的路由机制,在WebStorm下开发.本篇主要涉及UI-Route的嵌套State. 假设一个主视图上有两个部分视图,部分视图1和部分视图2,主视图对应着一个state,两 ...
- AngularJS路由系列(5)-- UI-Router的路由约束、Resolve属性、路由附加数据、路由进入退出事件
本系列探寻AngularJS的路由机制,在WebStorm下开发.主要包括: ● UI-Router约束路由参数● UI-Router的Resolve属性● UI-Router给路由附加数据● UI- ...
- AngularJS路由系列(4)-- UI-Router的$state服务、路由事件、获取路由参数
本系列探寻AngularJS的路由机制,在WebStorm下开发.主要包括: ● UI-Router的$state服务● UI-Router的路由事件● UI-Router获取路由参数 Angular ...
- AngularJS路由系列(3)-- UI-Router初体验
本系列探寻AngularJS的路由机制,在WebStorm下开发. AngularJS路由系列包括: 1.AngularJS路由系列(1)--基本路由配置2.AngularJS路由系列(2)--刷新. ...
- AngularJS路由系列(1)--基本路由配置
本系列探寻AngularJS的路由机制,在WebStorm下开发.主要包括: ● 路由的Big Picture ● $routeProvider配置路由 ● 使用template属性 ● 使用temp ...
- angularjs中关于当前路由再次点击强制刷新
angularjs中,有一个机制,就是当前路由再次点击的时候,不会再刷新页面,这实在是愁坏了包子,因为业务人员要求一定要刷新,于是我各种百度,然并卵....呜呜呜~~~~~ 于是乎,我就想到写指令了, ...
- angular 强制刷新路由,重新加载路由
angular js ui-route 在使用时默认不是不会刷新路由的,所有有些时候我们需要主动刷新路由. 主动刷新方法是: <a ui-sref="profitManage" ...
- vue中强制刷新的bug处理
vue是单页面应用,跳转路由也是局部刷新,这里就拿后台管理系统而言,如果你的后台管理系统是左右布局,你不会遇到这样的问题,但是如果你的后台管理系统是上左右布局,你就会遇到这个问题,一级菜单在最上面,二 ...
随机推荐
- P1061 最长连号
题目描述 输入n个正整数,(1<=n<=10000),要求输出最长的连号的长度.(连号指从小到大连续自然数) 输入格式 第一行,一个数n; 第二行,n个正整数,之间用空格隔开. 输出格式 ...
- P1006 输出第二个整数
题目描述 输入三个整数,整数之间由一个空格分隔,整数是32位有符号整数.把第二个输入的整数输出. 输入格式 输入三个整数,整数之间由一个空格分隔,整数是32位有符号整数. 输出格式 输出输入的三个整数 ...
- vue-cli起项目步骤
1.全局安装 vue-cli 老版本:npm install -g vue-cli (npm uninstall vue-cli -g 卸载) 新版本:npm install -g @vue/cli ...
- mapstatetoprops更新state但props不更新渲染的问题
通过react-redux和redux实现react组件之间的通信,reducer.action.store都编写正确,mapDispatchToProps也能正确传值.唯独mapStateToPro ...
- 【转载】VS Code 中的代码自动补全和自动导入包
原文连接:https://maiyang.me/post/2018-09-14-tips-vscode/ VSCode 必须安装以下插件: 首先你必须安装 Golang 插件,然后再给 Go 安装工具 ...
- 【题解】BZOJ4548 小奇的糖果(树状数组)
[题解]BZOJ4548 小奇的糖果(树状数组) 说在前面:我有个同学叫小奇,他有一个朋友叫达达,达达特爱地理和旅游,初中经常AK地理,好怀恋和他已经达达一起到当时初中附近许多楼盘的顶楼逛的时光... ...
- CAP理论的理解
CAP理论作为分布式系统的基础理论,它描述的是一个分布式系统在以下三个特性中: 一致性(Consistency) 可用性(Availability) 分区容错性(Partition tolerance ...
- 机器学习之路--Python
常用数据结构 1.list 列表 有序集合 classmates = ['Michael', 'Bob', 'Tracy'] len(classmates) classmates[0] len(cla ...
- 1083 是否存在相等的差 (20 分)C语言
给定 N 张卡片,正面分别写上 1.2.--.N,然后全部翻面,洗牌,在背面分别写上 1.2.--.N.将每张牌的正反两面数字相减(大减小),得到 N 个非负差值,其中是否存在相等的差? 输入格式: ...
- Spring的一些基本概念(面试备用哦)
1.什么是Spring, 它有什么特点? 包括哪些内容? Spring是一个轻量级的控制反转(IoC)和面向切面(AOP)的容器框架. ◆ 轻量——从大小与开销两方面而言Spring都是轻量的.完整 ...