Platform: NgrxLet: Structural directive clears view early, leading to issues with router transitions

[Kamshak]

When using the *ngrxLet structural directive in an app, the view is cleared as soon as ngOnDestroy() is called. This causes an issue with animations: the view that is animated out changes as all ngrxLet templates get cleared.

To illustrate the problem see this StackBlitz, compare the ngIf behavior with ngrxLet: https://stackblitz.com/edit/ngrx-bug-ngrxlet

I believe the problem could be fixed by removing this line: https://github.com/ngrx/platform/blob/c3ac25242717c6f4cbdb9287f9b3a83cd5dd51e1/modules/component/src/let/let.directive.ts#L178

The viewContainerRef should automatically be cleared by Angular when it is destroyed. Happy to make a PR to remove this line unless there are specific reasons why it needs to exist that I haven't considered.

CC @BioPhoton @markostanimirovic

[markostanimirovic]

@Kamshak Good catch! 👍

[BioPhoton]

@Kamshak I'll have a look in my notes, but it sounds pretty reasonable! Verynice catch!

[Kamshak]

Friendly reminder @BioPhoton, have you had a chance to look at this yet? Happy to create a PR to take that line out if that helps 😄

[BioPhoton]

Hi @Kadamas we shipped RxAngular/cdk now and updated RxAngular/template with its logic.
We should have this now in. Can you check rx-angular/[email protected], please?

Also here some cool examples of how to use the new CDK to build your own rxFor :D
https://stackblitz.com/edit/rx-angular-cdk-demo?file=src%2Fapp%2Frx-for.directive.ts

[Kamshak]

This is working great now, thanks for the fix @BioPhoton! Took a bit to try this because we had to move to rxLet/push from ngrxLet/ngrxPush. General question: does it make more sense to report issues in rx-angular?

Very interesting work on rxFor, will definitely be checking it out. We're using the cdk virtual for at the moment, but I'm thinking this could be a great way to get better perf on larger lists where the size of items is not known ahead of time.

[Kamshak]

The issue is fixed for me now, going to leave this open though as it's not yet fixed in the @ngrx/component package. Maintainers: feel free to close this issue at will 😄

[4javier]

I think the issue is not limited to router transition, but with parent's component :leave transition too.
Any milestone for this fix in @ngrx/component?