解决ui-router路由监听$stateChangeStart、$stateChangeSuccess、$stateChangeError不执行的问题
2024-08-30 02:30:33
问题解答
angular1项目导入ui-router之后,使用路由监听,代码如下
angular.module('app', ['ui.router', 'ui.router.state.events'])
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:得到上一个路由的参数
后记
如有不对的地方,还望大家指正,共同进步
最新文章
- 10. 星际争霸之php设计模式--原型模式
- JavaScript学习笔记及知识点整理_2
- unique-substrings-in-wraparound-string(好)
- win下 git gui 使用教程
- Java中Date对象与String互转
- AFN默认请求和响应的处理
- LeetCode(35)-Path Sum
- 微信跳转,手机WAP浏览器一键超级跳转微信指定页面
- jquery1.6中的.prop()和.attr()异同
- libgdx学习记录3——动画Animation
- Flask 系列之 LoginManager
- Spark思维导图之Spark SQL
- nrf24l01 IRQ一直为高电平
- 循序渐进学.Net Core Web Api开发系列【13】:中间件(Middleware)
- 基于 Promise 的 HTTP 请求客户端 axios
- bootstrap中如何控制input的宽度
- MySQL数据库事务各隔离级别加锁情况--read uncommitted篇(转)
- MySQL常见架构的应用
- Oracle数据误删除的恢复操作
- 两种Service如何一起使用