问题解答

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:得到上一个路由的参数

后记

如有不对的地方,还望大家指正,共同进步

解决ui-router路由监听$stateChangeStart、$stateChangeSuccess、$stateChangeError不执行的问题的更多相关文章

  1. Vue路由监听

    一.问题描述 描述:页面1showowner.vue跳转到页面2showuser.vue 需求:页面1的多个结点对应于一个页面2文件[页面2未展示] 问题:并不是页面一的一个结点对应一个页面二文件 处 ...

  2. angular ui.router 路由传参数

    angular已经用了一段时间了,最近在做路由,做一下笔记. 路由跳转的时候进行穿参 ui.router方式 <a ui-sref="edit({id:5})"> 编辑 ...

  3. vue的路由带参数和取参数,watch路由监听

    1.写在html里 <router-link :to="{path:'/goldShop/goodsInfo',query: { id:item.id }}" class=& ...

  4. angularjs -- 路由监听

    前几天,项目在做一个功能时需要在页面切换之前关闭正在执行的函数.尝试了几种方式都不行,最后想到既然angularjs是通过理由切换页面,那就在路由上面做文章吧.AngularJS在路由发生改变时,可以 ...

  5. vue 路由监听

    发现网上其实有很多种答案,但是测试之后发现很多都不行,或者写的不完整. 一.在app.vue组件内,增加监听$route,如下: watch: { $route(to, from) { console ...

  6. Angularjs ui router,路由嵌套 父controller执行问题

    解决方式来源:https://stackoverflow.com/questions/25316591/angularjs-ui-router-state-reload-child-state-onl ...

  7. UI EventSystem事件监听

    Unity5.0 EventSystem事件系统的详细说明 一.EventSystem对象的说明 当我们在场景中创建任一UI对象后,Hierarchy面板中都可以看到系统自动创建了对象EventSys ...

  8. vue路由钩子拦截器beforeEach和afterEach及页面路由变化路由监听

    在路由跳转的时候,我们需要一些权限判断或者其他操作.这个时候就需要使用路由的钩子函数. 定义:路由钩子主要是给使用者在路由发生变化时进行一些特殊的处理而定义的函数. 总体来讲vue里面提供了三大类钩子 ...

  9. 完美解决android软键盘监听

    最近在做应用性能调优,发现在一个包含有输入框的Activity中,当软键盘弹出的时候,如果直接finish掉此Activity,那么在返回到上一个Activity时,界面的渲染会由于软键盘没有及时的收 ...

随机推荐

  1. css中的视距perspective和视差效果

    概述 之前觉得2个效果很叼,一个是3D翻转效果,另一个是视差效果.今天好好的研究一下,把心得记录下来,供以后开发时参考,相信对其他人也有用. 3D翻转 3D翻转效果其实非常简单,其实就是perspec ...

  2. SWIG 基本概念和入门

    C 和 C++ 被公认为(理当如此)创建高性能代码的首选平台.对开发人员的一个常见要求是向脚本语言接口公开 C/C++ 代码,这正是 Simplified Wrapper and Interface ...

  3. 【app】Appium日志文件分析

    Appium在和客户端及手机端进行通讯的时候会输出很多日志,可以通过点击主面板的Get Raw Logs得到其原始日志: 现在我们另存到其他路径,并且以notepad工具打开进行查看 Appium日志 ...

  4. LSTMs和递归神经网络的初学者指南

    本文是读A Beginner's Guide to LSTMs and Recurrent Neural Networks的个人摘要. 递归网络 Recurrent nets 递归网络是一种人工神经网 ...

  5. 微信小程序内嵌业务域名内的网页

    微信小程序在2017年11月左右开放了内嵌网页的功能,即新组件<web-view>.官方文档链接:https://mp.weixin.qq.com/debug/wxadoc/dev/com ...

  6. cp2102 驱动 win7x64 -2018

    试了好多种网上的驱动,都不行,要么是报错要么是安装没反应 之后意外遇见驱动官网?里面真全 url:https://www.silabs.com/products/development-tools/s ...

  7. Android--UI之Fragment

    前言 开门见山开篇名义,本篇博客将讲解一下Android中Fragment的内容,必要的地方会提供相应的演示代码,并且会在最后给出源码下载. 本文主要有以下内容: 什么是Fragment 如何创建一个 ...

  8. jsp fmt页面显示value does not support runtime expressions

    最近使用Struts2+Spring3+Mybatis3做一个项目,在用户修改页面显示生日, <fmt:formatDate value="${user.birthday}" ...

  9. JavaScript高级编程(1)——JavaScript初识

    一.javascript的简介 1.1 javascript的历史回顾. Javascript诞生于1995年.当时,它主要的目的是用来处理一些由服务器端处理的输入验证操作.在javascript没有 ...

  10. 设置Firefox(火狐)浏览器的中文菜单/界面

    步骤一: 设置Firefox浏览器的中文菜单/界面.首先需要查一下正在使用的火狐版本号(小生使用的火狐版本是55.0.3).      步骤二: 下载对应版本的xpi中文插件 其次,访问下面的火狐官方 ...