gund
commented
1 year ago Emm, in your repro case you clearly forgot to add trackBy to the ngFor directive used with ndc-dynamic component...
Once you add it it works as expected. Can't see any issues with the library and we have full suite of unit tests covering exact cases when a dynamic component should be recreated and when not so that's probably just something you forgot.
nuno-tiago-reis
Describe the bug We've started using ng-dynamic-component some weeks ago and our application is state driven. So we're rendering a list of dynamic components. We've been having an issue where the components seem to be recreated, even though we're using trackBy inside our ngFor, so it doesn't recreate the DOM from scratch every time the array changes. I've linked a stackblitz below that exemplifies this issue, the first scenario using ng-dynamic-component and the second scenario using ngComponentOutlet, I think it should be clear what the issue is.
This stackblitz has three simple components, that increment a number based on a set interval, and every time the component is recreated, the number gets reset to 0.
In the ng-dynamic-component scenario, every time the array gets shuffled using the Shuffle button, the numbers remain what they were before. However, when we use the Shuffle with Clone button, the numbers all reset to 0.
In the ngComponentOutlet scenario, every time the array gets shuffled using either button, the numbers remain what they were before.
The difference between the two buttons is that one of them is using lodash.clonedeep to clone the array that we're iterating, but other than that, they do the exact same thing.
Expected behavior We would expect the component to not be recreated since the component type itself didn't change. If this is a known limitation, is there any way we can get around it?
Reproduction Stackblitz
Screenshots
Thanks!