ui-router transitionhooks

统一控制路由跳转, 前台控制如果没有登录就跳转到登录页面, 当然也可以在后台控制, 如果没有登录就返回对应的错误码, 然后在response中直接跳转

监听$transitions.onStart事件

  1. 监听所有的state

    angular.module('secu',['ui.router'])
    .run(function($rootScope, $transitions, $state) {
    $transitions.onStart({}, function(trans) {
    var stateName = trans.to().name;
    if ((stateName == 'admin.traininer' || stateName == 'admin.miss') && !localStorage.getItem('sessionid')) {
    return trans.router.stateService.target('login');
    }
    })
    });
  2. 监听指定的state

    angular.module('secu',['ui.router'])
    .run(function($rootScope, $transitions, $state) {
    $transitions.onStart({
    to: function(state) {
    return (['admin.traininer', 'admin.miss']).indexOf(state.name) > -1;
    }
    }, function(trans) {
    var stateName = trans.to().name;
    if (!localStorage.getItem('sessionid')) {
    // 下面的代码完成redirect
    return trans.router.stateService.target('login');
    // 如果直接返回false 则是放弃当前的state跳转
    // return false
    }
    })
    });

ui-router 1.0以上的 $stateChangeStart的更多相关文章

  1. 【原创】ui.router源码解析

    Angular系列文章之angular路由 路由(route),几乎所有的MVC(VM)框架都应该具有的特性,因为它是前端构建单页面应用(SPA)必不可少的组成部分. 那么,对于angular而言,它 ...

  2. angular : $location & $state(UI router)的关系

    次序:angular 的 location会先跑 $rootScope.$on("$locationChangeStart", function (scope, newUrl, o ...

  3. ngRoute 与ui.router区别

    angular路由 路由 (route) ,几乎所有的 MVC(VM) 框架都应该具有的特性,因为它是前端构建单页面应用 (SPA) 必不可少的组成部分. 那么,对于 angular 而言,它自然也有 ...

  4. AngularJS 使用 UI Router 实现表单向导

    Today we will be using AngularJS and the great UI Router and the Angular ngAnimate module to create ...

  5. [转]AngularJS 使用 UI Router 实现表单向导

    本文转自:http://www.oschina.net/translate/angularjs-multi-step-form-using-ui-router 今天我们将使用AngularJs和伟大的 ...

  6. [转]AngularJS+UI Router(1) 多步表单

    本文转自:https://www.zybuluo.com/dreamapplehappy/note/54448 多步表单的实现   在线demo演示地址https://rawgit.com/dream ...

  7. 【共享单车】—— React后台管理系统开发手记:Router 4.0路由实战演练

    前言:以下内容基于React全家桶+AntD实战课程的学习实践过程记录.最终成果github地址:https://github.com/66Web/react-antd-manager,欢迎star. ...

  8. React Router 4.0 体验

    React Router 4.0 (以下简称 RR4) 已经正式发布,它遵循React的设计理念,即万物皆组件.所以 RR4 只是一堆 提供了导航功能的组件(还有若干对象和方法),具有声明式(声明式编 ...

  9. cocos studio UI 1.6.0.0 修改导出项目路径

    因为cocos studio UI 1.6.0.0版本没有自动修改默认导出路径的功能,新建项目后默认导出的路径还是上一个项目的,每次导出都要重新设置路径很麻烦.于是考虑是否可以找到默认配置文件,终于还 ...

  10. react router 4.0以上的路由应用

    thead>tr>th{padding:8px;line-height:1.4285714;border-top:1px solid #ddd}.table>thead>tr& ...

随机推荐

  1. React 学习参考资料链接

    node.js官网https://nodejs.org/en/download/ React 入门实例教程http://www.ruanyifeng.com/blog/2015/03/react.ht ...

  2. 分布式链路监控与追踪系统Zipkin

    1.分布式链路监控与追踪产生背景2.SpringCloud Sleuth + Zipkin3.分布式服务追踪实现原理4.搭建Zipkin服务追踪系统5.搭建Zipkin集成RabbitMQ异步传输6. ...

  3. [转载]织梦DEDE多选项筛选_联动筛选功能的实现_二次开发

    织梦默认的列表页没有筛选功能,但有时候我们做产品列表页的时候,产品的字段比较多,很多人都需要用到筛选功能,这样可以让用户更方便的找到自己所需要的东西,实现这个联动筛选功能需要对织梦进行二次开发,下面就 ...

  4. Linux常用命令.rpm

    1.安装: rpm -ivh 包全名(查询依赖网址:http://www.rpmfind.net) -i(install):安装 -v(verbose):显示详细信息 -h(hash):显示进度 -- ...

  5. define用于条件编译

    格式: #ifndef _test.h_ //这里放不想被重复包含的代码 #define _test.h_ #endif define用于条件编译的意思是不想让头文件重复编译,头文件重复编译会造成的结 ...

  6. LeetCode第[56]题(Java):Merge Intervals

    题目:合并区间 难度:Medium 题目内容:   Given a collection of intervals, merge all overlapping intervals. 翻译: 给定一个 ...

  7. yii2输出sql

    yii2如何输出sql语句? 单表查询sql: 我的model是:coupon,那么sql输出为: $a = coupon::find()->createCommand()->getRaw ...

  8. 装饰类——wpf

    decorator:在元素“周围”设置外边框.背景或者二者. adorner:在已存在的Visual  “之上”叠加Visual. AdornerDecorator:为可视化树中其下面的元素提供一个装 ...

  9. CPU Usage (C#) 测试

    注意:算法仅供参考. cpuusage.cs using System; using System.Collections.Generic; using System.Diagnostics; usi ...

  10. poj3181 背包+大数

    http://poj.org/problem?id=3181 Dollar Dayz Time Limit: 1000MS   Memory Limit: 65536K Total Submissio ...