Skip to content

Feature: expose $animate promise to controller #2562

Closed
@christopherthielen

Description

@christopherthielen

This is in relation to #1643

Prior to 0.2.16, a ui-view's $scope was destroyed just before the ui-view started to be animated out. This caused some problems for certain users, because they were relying on the $destroy event to clean up resources (the ticket in question was cleaning up highcharts). They requested that the destroy event be deferred until after the animation was completed.

We misinterpreted the information to mean that any bound variables were becoming unbound, and "garbling" the data on the page while the transition was in progress. This interpretation was incorrect, as this plunker shows: http://plnkr.co/edit/VI7tF1?p=preview (the scope is destroyed, and previously bound values remain in the DOM, while the ui-view is animated out).

This change in the timing of the $destroy for a ui-view's $scope caused issues for other users, who rely on the original timing and lifecycle, so that lifecycle event listeners are deregistered just before the ui-view is animated out.

We have discussed this issue internally, and I think we can revert to the 0.2.15 behavior of destroying the $scope before the ui-view animates out. We think that exposing the animation promise to a controller function will allow a hook for the "clean up resources on $destroy" crowd to do so after the animation is complete.

Something like <div ui-view on-destroy="vm.scheduleCleanup($event)"></div> and then

function ctrl() {
  this.scheduleCleanup = function(event) {
    event.promise.then(cleanup());
  }
  this.cleanup = functino() {
    //     clean up highcharts resources
  }
}

screen shot 2016-02-17 at 5 16 01 pm

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions