Angular 17 @empty block not working in nested propagated component #53570
Description
Which @angular/* package(s) are the source of the bug?
core
Is this a regression?
No
Description
When I try to display some HTML within an @empty block is not rendering anything whereas if I am using a @if approach is working fine.
Bellow snippet belongs to a nested HTML propagated using Angular projections (the main attribute is a projection area)
<plc-box main *ngrxLet="games$ as games">
@for (game of games; track game._id) {
<plc-game-row main [game]="game"></plc-game-row>
} @empty { <!-- <=== This line FAILS-->
<!-- } @if(games.length === 0) { --> <!-- <=== This line WORKS-->
<ng-container main>
<plc-icon [name]="'landscape'" ></plc-icon>
<plc-label class="plc-search-game__no-record-label">
{{ 'pages.search-game.no-results' | translate }}
</plc-label>
</ng-container>
}
</plc-box>Same code outside of a propagation based component works fine (e.g. inside a regular <div></div>)
Please provide a link to a minimal reproduction of the bug
Minimal reproduction in StackBlitz
Please provide the exception or error you saw
I see a blank spot where a HTML should be displayed instead
Please provide the environment you discovered this bug in (run ng version)
Angular CLI: 17.0.7
Node: 18.18.2
Package Manager: npm 9.8.1
OS: win32 x64
Angular: 17.0.7
... animations, cli, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router
Package Version
---------------------------------------------------------
@angular-devkit/architect 0.1700.7
@angular-devkit/build-angular 17.0.7
@angular-devkit/core 17.0.7
@angular-devkit/schematics 17.0.7
@angular/cdk 16.0.1
@angular/material 16.0.1
@schematics/angular 17.0.7
ng-packagr 17.0.2
rxjs 7.8.1
typescript 5.2.2
zone.js 0.14.2
Anything else?
No response