Repository navigation
AngularJS structural directives doesn't render Angular web components created using Angular elements #56174
Description
Which @angular/* package(s) are the source of the bug?
elements
Is this a regression?
Yes
Description
Custom web components created using Angular's 'createCustomElement' do not render inside AngularJs's structural directives like ng-repeat and ng-if etc.
Web components created using native APIs work fine inside AngularJs's structural directives, only angular's web components are not rendering.
Please provide a link to a minimal reproduction of the bug
https://stackblitz.com/edit/typescript-ufccb5?file=index.ts,index.html
Please provide the exception or error you saw
In the provided stackblitz link, the Angular's web component renders correctly for the first time.
Now click on the ADD button.
The Angular's web component is removed completely from the DOM. In contrast, the web component created using just the native HTML works fine.
Please provide the environment you discovered this bug in (run ng version)
The issue can be replicated with Angular 15 as well
Anything else?
No response
Activity
madman-maverick commentedon May 31, 2024
Faced the same issue myself. Seems like it is closely related to #38778 as setting 'scheduledDestroyFn = null' hides the issue on the surface (it is not a solution as the ngOnDestroy is never called and component is never destroyed).
Chirag-Khanna commentedon Sep 5, 2024
Any updates on the above issue?? Faced similar issue. Looks like Angular's ngFor is also getting effected when it contains such web components within it. Resulting in exceptions for the end user.