Control flow schematic: [ngIf] + [ngIfElse] + [ngTemplateOutlet] is not migrated properly

[mattlewis92]

Which @angular/* package(s) are the source of the bug?

core

Is this a regression?

No

Description

Input:

<ng-template
  [ngIf]="fooTemplate"
  [ngIfElse]="barTemplate"
  [ngTemplateOutlet]="fooTemplate"
></ng-template>

<ng-template #fooTemplate>Foo</ng-template>
<ng-template #barTemplate>Bar</ng-template>

Output:

@if (fooTemplate) {
  <ng-template
    [ngIfElse]="barTemplate"
    [ngTemplateOutlet]="fooTemplate"
  ></ng-template>
} @else {
  Bar
}
<ng-template #fooTemplate>Foo</ng-template>
<ng-template #barTemplate>Bar</ng-template>

Expected output ([ngIfElse]="barTemplate" should be removed):

@if (fooTemplate) {
  <ng-template
    [ngTemplateOutlet]="fooTemplate"
  ></ng-template>
} @else {
  Bar
}
<ng-template #fooTemplate>Foo</ng-template>
<ng-template #barTemplate>Bar</ng-template>

Please provide a link to a minimal reproduction of the bug

No response

Please provide the exception or error you saw

No response

Please provide the environment you discovered this bug in (run ng version)

Angular CLI: 17.0.5
Node: 18.17.1
Package Manager: pnpm 8.11.0
OS: darwin arm64

Angular: 17.1.0-next.2+sha-1940280
... core

Package                             Version
-------------------------------------------------------------
@angular-devkit/architect           0.1700.1
@angular-devkit/build-angular       17.0.5
@angular-devkit/core                17.0.5
@angular-devkit/schematics          17.0.5
@angular/animations                 17.0.5
@angular/cdk                        17.0.1
@angular/cli                        17.0.5
@angular/common                     17.0.5
@angular/compiler                   17.0.5
@angular/compiler-cli               17.0.5
@angular/elements                   17.0.5
@angular/forms                      17.0.5
@angular/google-maps                15.2.9
@angular/language-service           17.0.5
@angular/localize                   17.0.5
@angular/platform-browser           17.0.5
@angular/platform-browser-dynamic   17.0.5
@angular/router                     17.0.5
@angular/service-worker             17.0.5
@schematics/angular                 17.0.5
ng-packagr                          17.0.2
rxjs                                7.8.0
typescript                          5.2.2
webpack                             5.88.2
zone.js                             0.14.2

Anything else?

I am using "@angular/core": "angular/core-builds#17.1.0-next.2+1940280", which is built from the HEAD of the main branch and contains all the latest control flow migration fixes.

[jessicajaniuk]

Thanks! Fix is in #53298.

[jessicajaniuk]

Also, your expected output is a hair off. The #barTemplate would be removed in this case since it's no longer needed.

@if (fooTemplate) {
  <ng-template
    [ngTemplateOutlet]="fooTemplate"
  ></ng-template>
} @else {
  Bar
}
<ng-template #fooTemplate>Foo</ng-template>

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}