Description
Which @angular/* package(s) are the source of the bug?
localize
Is this a regression?
Yes
Description
Note: I do not know if this is a regression or has been there forever.
We recently started migrating our Angular project at work over to the
new control-flow syntax (@if and @for) using the provided angular
migration for it.
This migrated a few of our pieces of code that looked like this:
<div i18n="@@some-key">
Text A
<ng-container *ngIf="bool">
Text B
</ng-container>
</div>To look like this:
<div i18n="@@some-key">
Text A
@if(bool){
Text B
}
</div>This correctly breaks at build-time/when you try to ng-serve your
application as the content of @@some-key no longer is the same, the
placeholders changed from START_NG_CONTAINER etc. to START_BLOCK_IF etc. .
Not understanding the problem, we just added ng-container back in the
hope that this alleviates the problem:
<div i18n="@@some-key">
Text A
@if(bool){
<ng-container>
Text B
</ng-container>
}
</div>This incorrectly will run with ng-serve despite the fact that the
content of @@some-key still changed, as START_BLOCK_IF were added to the
contents!
What you instead will see are runtime errors of various ilks about how
Nodes can't be inserted into the DOM, expressed through various different exceptions depending on the scenario.
Please provide a link to a minimal reproduction of the bug
No response
Please provide the exception or error you saw
hook.js:608 ERROR HierarchyRequestError: Failed to execute 'appendChild' on 'Node': The new child element contains the parent.
at EmulatedEncapsulationDomRenderer2.appendChild (platform-browser.mjs:553:22)
at BaseAnimationRenderer.appendChild (browser.mjs:4576:23)
at nativeAppendChild (core.mjs:11435:14)
at nativeAppendOrInsertBefore (core.mjs:11442:9)
at appendChild (core.mjs:11523:13)
at ɵɵelementStart (core.mjs:24350:9)
at GradYearEntryComponent_Template (grad-year-entry.component.html:1:20)
at executeTemplate (core.mjs:12159:9)
at renderView (core.mjs:13366:13)
at renderComponent (core.mjs:13312:5)
Please provide the environment you discovered this bug in (run ng version)
Angular CLI: 18.0.7
Node: 18.20.3
Package Manager: npm 10.7.0
OS: linux x64
Angular: 18.2.13
... animations, common, compiler, compiler-cli, core, forms
... language-service, localize, platform-browser
... platform-browser-dynamic, router
Package Version
---------------------------------------------------------
@angular-devkit/architect 0.1802.17
@angular-devkit/build-angular 18.2.17
@angular-devkit/core 18.2.17
@angular-devkit/schematics 18.2.17
@angular/cdk 18.2.14
@angular/cli 18.0.7
@angular/material 18.2.14
@schematics/angular 18.0.7
rxjs 7.8.2
typescript 5.4.5
zone.js 0.14.10
Anything else?
No response