I'm having a problem creating a component that renders a a collection of items based on a custom Observable and custom item TemplateRef.
The component takes the Observable and TemplateRef as inputs and renders them appropriately. The problem comes in where the collection changes and all items in the collection are destroyed and recreated.
This is obviously problematic where I depend on animations to indicate items entering and leaving the collection (or changing position in the collection).
If my component, instead, renders the component directly (i.e. not the TemplateRef input) I don't have this issue of components being destroyed every time the collection changes. I think I may have narrowed the problem down to passing the item from the *ngFor on the templates outlet context.
I've got a reproduction of the problem here demonstrating the difference between rendering the TemplateRef and component directly. The ngOnDestroy is logged to the console as well as an animation for when the component :enters. I think this plnkr demonstrates the problem clearly.
Any help with this would be appreciated.