Skip to content

Commit

Permalink
fix(ui-view): change $viewContentLoading to pair with $viewContentLoaded
Browse files Browse the repository at this point in the history
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.
  • Loading branch information
Matt Ginzton committed May 29, 2015
1 parent dba25db commit f9b43d6
Show file tree
Hide file tree
Showing 2 changed files with 17 additions and 31 deletions.
26 changes: 0 additions & 26 deletions src/view.js
Original file line number Diff line number Diff line change
Expand Up @@ -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
*
* <pre>
* $scope.$on('$viewContentLoading',
* function(event, viewConfig){
* // Access to all the view config properties.
* // and one special property 'targetView'
* // viewConfig.targetView
* });
* </pre>
*/
$rootScope.$broadcast('$viewContentLoading', options);
}
return result;
}
};
Expand Down
22 changes: 17 additions & 5 deletions src/viewDirective.js
Original file line number Diff line number Diff line change
Expand Up @@ -180,9 +180,6 @@ function $ViewDirective( $state, $injector, $uiViewScroll, $interpolate)
scope.$on('$stateChangeSuccess', function() {
updateView(false);
});
scope.$on('$viewContentLoading', function() {
updateView(false);
});

updateView(true);

Expand Down Expand Up @@ -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) {
Expand All @@ -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);
}
};
Expand Down

0 comments on commit f9b43d6

Please sign in to comment.