activity.js
Angular 路由状态发生改变时可以通过'$stateChangeStart'、'$stateChangeSuccess'、'$stateChangeError'监听,通过注入'$location'实现状态的管理,
页面路由变化,模板开始解析之前执行toState.name == 'activity.note' 或 toState.name == 'activity.escapeClause' 为true时,给body,html添加class 。
1 var activityApp = angular.module('activityApp', ['ui.router', 'activityControllers']); 2 3 activityApp.run(['$rootScope', '$location', function ($rootScope, $location) {
// stateChangeStart 当模板开始解析之前触发 4 $rootScope.$on('$stateChangeStart', function (event, toState, toParams, fromState, fromParams) { 5 // event.preventDefault()可以阻止模板解析 6 if (toState.name == 'activity.note' || toState.name == 'activity.escapeClause') { 7 angular.element('body,html').addClass('scroll-bar'); 8 } else { 9 angular.element('body,html').removeClass('scroll-bar'); 10 } 11 }); 12 // stateChangeSuccess 当模板解析完成后触发 13 $rootScope.$on('$stateChangeSuccess', function (event, toState, toParams, fromState, fromParams) { 14 15 }); 16 17 // $stateChangeError 当模板解析过程中发生错误时触发 18 $rootScope.$on('$stateChangeError', function (event, toState, toParams, fromState, fromParams, error) { 19 20 }); 21 }]);
PS:参考官方文档 https://github.com/angular-ui/ui-router/wiki