解决ui-router路由监听$stateChangeStart、$stateChangeSuccess、$stateChangeError不执行的问题
问题解答
angular1项目导入ui-router之后,使用路由监听,代码如下
angular.module("app")
.run(['$rootScope', function ($rootScope) {
// 监听路由开始时触发
$rootScope.$on('$stateChangeStart', function () {}
// 监听路由成功时触发
$rootScope.$on('$stateChangeSuccess', function () {}
// 监听路由出现错误时触发
$rootScope.$on('$stateChangeStart', function () {}
})
}])
当切换路由的时候,原本应该会监听到路由的变化,但是实际却没有走这个路由监听器,这是为什么呢?答案如下:
这时需要在index.html导入一个stateEvents.js库文件,解决路由监听不到的问题(PS:必须在angular.module主模块下注入'ui.router.state.events')
附上ui-router官方教程地址:https://ui-router.github.io/ng1/
附上stateEvents.js官方教程地址:https://ui-router.github.io/ng1/docs/latest/modules/ng1_state_events.html#_statechangeerror
参数解读
根据stateEvents.js官方教程地址,路由监听提供的参数部分翻译
event: 该事件的基本信息
toState: 得到当前路由的信息,比如路由名称,url,视图的控制器,模板路径等
toParams: 得到当前路由的参数
fromState: 得到上一个路由的信息,比如路由名称,url,视图的控制器,模板路径等
fromParams:得到上一个路由的参数
后记
如有不对的地方,还望大家指正,共同进步
解决ui-router路由监听$stateChangeStart、$stateChangeSuccess、$stateChangeError不执行的问题的更多相关文章
- Vue路由监听
一.问题描述 描述:页面1showowner.vue跳转到页面2showuser.vue 需求:页面1的多个结点对应于一个页面2文件[页面2未展示] 问题:并不是页面一的一个结点对应一个页面二文件 处 ...
- angular ui.router 路由传参数
angular已经用了一段时间了,最近在做路由,做一下笔记. 路由跳转的时候进行穿参 ui.router方式 <a ui-sref="edit({id:5})"> 编辑 ...
- vue的路由带参数和取参数,watch路由监听
1.写在html里 <router-link :to="{path:'/goldShop/goodsInfo',query: { id:item.id }}" class=& ...
- angularjs -- 路由监听
前几天,项目在做一个功能时需要在页面切换之前关闭正在执行的函数.尝试了几种方式都不行,最后想到既然angularjs是通过理由切换页面,那就在路由上面做文章吧.AngularJS在路由发生改变时,可以 ...
- vue 路由监听
发现网上其实有很多种答案,但是测试之后发现很多都不行,或者写的不完整. 一.在app.vue组件内,增加监听$route,如下: watch: { $route(to, from) { console ...
- Angularjs ui router,路由嵌套 父controller执行问题
解决方式来源:https://stackoverflow.com/questions/25316591/angularjs-ui-router-state-reload-child-state-onl ...
- UI EventSystem事件监听
Unity5.0 EventSystem事件系统的详细说明 一.EventSystem对象的说明 当我们在场景中创建任一UI对象后,Hierarchy面板中都可以看到系统自动创建了对象EventSys ...
- vue路由钩子拦截器beforeEach和afterEach及页面路由变化路由监听
在路由跳转的时候,我们需要一些权限判断或者其他操作.这个时候就需要使用路由的钩子函数. 定义:路由钩子主要是给使用者在路由发生变化时进行一些特殊的处理而定义的函数. 总体来讲vue里面提供了三大类钩子 ...
- 完美解决android软键盘监听
最近在做应用性能调优,发现在一个包含有输入框的Activity中,当软键盘弹出的时候,如果直接finish掉此Activity,那么在返回到上一个Activity时,界面的渲染会由于软键盘没有及时的收 ...
随机推荐
- docker 简单介绍及基础命令运用
一.什么是docker? Docker 是一个开源的应用容器引擎,基于 Go 语言 并遵从Apache2.0协议开源. 简单的来讲Docker实际上就是一个大型容器.容器是完全使用沙箱机制,相互之间不 ...
- 浅谈React16框架 - Fiber
前言 React实现可以粗划为两部分:reconciliation(diff阶段)和 commit(操作DOM阶段).在 v16 之前,reconciliation 简单说就是一个自顶向下递归算法,产 ...
- ubuntu16.04 服务器允许远程连接
ubuntu默认安装了openssh-client,openssh-server需要手动安装. 查看是否安装了ssh服务 apt-cache policy openssh-client openssh ...
- Shell中判断文件,目录是否存在
一. 具体每个选项对应的判断内容: -e filename 如果 filename存在,则为真 -d filename 如果 filename为目录,则为真 -f filename 如果 filena ...
- IdentityServer4(7)- 使用客户端认证控制API访问(客户端授权模式)
一.前言 本文已更新到 .NET Core 2.2 本文包括后续的Demo都会放在github:https://github.com/stulzq/IdentityServer4.Samples (Q ...
- Java线程之 InterruptedException 异常
Java线程之 InterruptedException 异常 当一个方法后面声明可能会抛出InterruptedException 异常时,说明该方法是可能会花一点时间,但是可以取消的方法. 抛 ...
- 编写高质量代码改善java程序的151个建议——[1-3]基础?亦是基础
原创地址: http://www.cnblogs.com/Alandre/ (泥沙砖瓦浆木匠),需要转载的,保留下! Thanks The reasonable man adapts himse ...
- Mysql 锁和锁算法
相关命令: show engines; 查看数据库支持的引擎 show variables like '%storage_engine%'; 查看数据库默认的引擎 select @@global ...
- leetcode — permutations-ii
import java.util.ArrayList; import java.util.Arrays; import java.util.List; /** * Source : https://o ...
- JavaScript基础——深入学习async/await
本文由云+社区发表 本篇文章,小编将和大家一起学习异步编程的未来--async/await,它会打破你对上篇文章Promise的认知,竟然异步代码还能这么写! 但是别太得意,你需要深入理解Promis ...