Content in nested outlets is removed before animation finishes
Here is a JSbin that demonstrates the issue. Navigate to about/team, and then click the "Index" link to navigate back to the index. At this last transition you will see that the "Team" content residing in the about template's outlet disappears right as the App.AboutView starts to animate out.
http://emberjs.jsbin.com/gegib/1/edit?html,js,output
@billdami that can easily be fixed by adding an animate out hook on the 'about.team' route:
App.AboutTeamView = Em.View.extend({
animateOut: function(done) {
Em.run.later(this, done, 1000);
}
});
http://emberjs.jsbin.com/voyatada/2/edit?js,output
Not sure if this should be built-in or at least documented on how to handle nested routes. Naturally the view will be destroyed unless animateOut hook is called.
Thanks for the fix @narkeeso, makes sense. But yeah, I wonder if maybe that should be the default behavior (if possible), as it seems to me that in most cases you will want the content in the nested route's view to not be destroyed until its parent view is done animating out. Having to explicitly define views for all my nested routes and give them an animateOut hook that just delays their removal seems like it could add a lot of extra code clutter, especially if you have a deeply nested route structure.
@narkeeso @billdami Yep, this is definitely true, however I think the behavior for nested views should be to not call the destroy() on child views until the parent view's animateOut() has finished. That seems like it's more in line with expected behavior and how normal nested views (outside of nested outlets) currently work.
able to make any progress on this one?