From e880209688704b0ba7fe1f6f1f94af8d9ae081fb Mon Sep 17 00:00:00 2001 From: Matt Ginzton Date: Fri, 29 May 2015 16:40:00 -0700 Subject: [PATCH] fix(ui-view): change $viewContentLoading to pair with $viewContentLoaded The old $viewContentLoaded event wasn't needed for the one internal client (ui-view) because ui-view always ignores that event and acts on a $stateChangeSuccess event that follows right behind anyway. And it wasn't as useful to external clients as it could be because it wasn't delivered on every view update -- it was delivered only on state transitions that activate a state defining a view, and didn't deal with inheritance. Also, neither $viewContentLoading nor $viewContentLoaded events contained the name of the view loading or loaded. This change makes $viewContentLoading and $viewContentLoaded be emitted always in pairs, before/after updateView does the work of actually loading the view, and both events include the name of the view being loaded. This is a breaking change for users of the old $viewContentLoading event that relied on it being broadcast from the root scope, the precise time it was broadcast, the fact that it wasn't always sent when a view is loaded even if $viewContentLoaded will be sent, or the "options" parameter that was emitted with it. If people rely on any of that behavior and we can't break it, then we can restore the old behavior but I think there needs to be some other event which is reliably paired with $viewContentLoaded and contains the view name, and I can't think of a better name than $viewContentLoading for that event. Closes #685. --- src/view.js | 26 -------------------------- src/viewDirective.js | 22 +++++++++++++++++----- 2 files changed, 17 insertions(+), 31 deletions(-) diff --git a/src/view.js b/src/view.js index f19a3c569..94334d31b 100644 --- a/src/view.js +++ b/src/view.js @@ -36,32 +36,6 @@ function $ViewProvider() { if (options.view) { result = $templateFactory.fromConfig(options.view, options.params, options.locals); } - if (result && options.notify) { - /** - * @ngdoc event - * @name ui.router.state.$state#$viewContentLoading - * @eventOf ui.router.state.$view - * @eventType broadcast on root scope - * @description - * - * Fired once the view **begins loading**, *before* the DOM is rendered. - * - * @param {Object} event Event object. - * @param {Object} viewConfig The view config properties (template, controller, etc). - * - * @example - * - *
-         * $scope.$on('$viewContentLoading',
-         * function(event, viewConfig){
-         *     // Access to all the view config properties.
-         *     // and one special property 'targetView'
-         *     // viewConfig.targetView
-         * });
-         * 
- */ - $rootScope.$broadcast('$viewContentLoading', options); - } return result; } }; diff --git a/src/viewDirective.js b/src/viewDirective.js index b70220779..497a7be12 100644 --- a/src/viewDirective.js +++ b/src/viewDirective.js @@ -180,9 +180,6 @@ function $ViewDirective( $state, $injector, $uiViewScroll, $interpolate) scope.$on('$stateChangeSuccess', function() { updateView(false); }); - scope.$on('$viewContentLoading', function() { - updateView(false); - }); updateView(true); @@ -216,6 +213,20 @@ function $ViewDirective( $state, $injector, $uiViewScroll, $interpolate) newScope = scope.$new(); latestLocals = $state.$current.locals[name]; + /** + * @ngdoc event + * @name ui.router.state.directive:ui-view#$viewContentLoading + * @eventOf ui.router.state.directive:ui-view + * @eventType emits on ui-view directive scope + * @description + * + * Fired once the view **begins loading**, *before* the DOM is rendered. + * + * @param {Object} event Event object. + * @param {string} viewName Name of the view. + */ + newScope.$emit('$viewContentLoading', name); + var clone = $transclude(newScope, function(clone) { renderer.enter(clone, $element, function onUiViewEnter() { if(currentScope) { @@ -236,12 +247,13 @@ function $ViewDirective( $state, $injector, $uiViewScroll, $interpolate) * @name ui.router.state.directive:ui-view#$viewContentLoaded * @eventOf ui.router.state.directive:ui-view * @eventType emits on ui-view directive scope - * @description * + * @description * Fired once the view is **loaded**, *after* the DOM is rendered. * * @param {Object} event Event object. + * @param {string} viewName Name of the view. */ - currentScope.$emit('$viewContentLoaded'); + currentScope.$emit('$viewContentLoaded', name); currentScope.$eval(onloadExp); } };