angular · jessicajaniuk · Nov 30, 2023
diff --git a/packages/core/schematics/ng-generate/control-flow-migration/ifs.ts b/packages/core/schematics/ng-generate/control-flow-migration/ifs.ts
@@ -87,6 +87,9 @@ function migrateNgIf(etm: ElementToMigrate, tmpl: string, offset: number): Resul
 function buildIfBlock(etm: ElementToMigrate, tmpl: string, offset: number): Result {
  const aliasAttrs = etm.aliasAttrs!;
  const aliases = [...aliasAttrs.aliases.keys()];
+  if (aliasAttrs.item) {
+    aliases.push(aliasAttrs.item);
+  }

  // includes the mandatory semicolon before as
  const lbString = etm.hasLineBreaks ? '\n' : '';
@@ -133,6 +136,9 @@ function buildStandardIfElseBlock(
 function buildBoundIfElseBlock(etm: ElementToMigrate, tmpl: string, offset: number): Result {
  const aliasAttrs = etm.aliasAttrs!;
  const aliases = [...aliasAttrs.aliases.keys()];
+  if (aliasAttrs.item) {
+    aliases.push(aliasAttrs.item);
+  }

  // includes the mandatory semicolon before as
  let condition = etm.attr.value.replace(' as ', '; as ');

diff --git a/packages/core/schematics/test/control_flow_migration_spec.ts b/packages/core/schematics/test/control_flow_migration_spec.ts
@@ -356,6 +356,35 @@ describe('control flow migration', () => {
      ].join('\n'));
    });

+    it('should migrate an if case as a binding with let variable with no value', async () => {
+      writeFile('/comp.ts', `
+        import {Component} from '@angular/core';
+        import {NgIf} from '@angular/common';
+
+        @Component({
+          templateUrl: './comp.html'
+        })
+        class Comp {
+          show = false;
+        }
+      `);
+
+      writeFile('/comp.html', [
+        `<ng-template [ngIf]="viewModel$ | async" let-vm>`,
+        `  {{vm | json}}`,
+        `</ng-template>`,
+      ].join('\n'));
+
+      await runMigration();
+      const content = tree.readContent('/comp.html');
+
+      expect(content).toBe([
+        `@if (viewModel$ | async; as vm) {`,
+        `  {{vm | json}}`,
+        `}`,
+      ].join('\n'));
+    });
+
    it('should migrate an if else case as bindings', async () => {
      writeFile('/comp.ts', `
        import {Component} from '@angular/core';