angular · jessicajaniuk · Oct 24, 2023
diff --git a/packages/core/schematics/ng-generate/control-flow-migration/util.ts b/packages/core/schematics/ng-generate/control-flow-migration/util.ts
@@ -155,8 +155,8 @@ export function migrateTemplate(template: string): {migrated: string|null, error
  let offset = 0;
  let nestLevel = -1;
  let postOffsets: number[] = [];
-  let migrateResult: Result = {tmpl: result, offsets: {pre: 0, post: 0}};
  for (const el of visitor.elements) {
+    let migrateResult: Result = {tmpl: result, offsets: {pre: 0, post: 0}};
    // applies the post offsets after closing
    if (el.nestCount <= nestLevel) {
      const count = nestLevel - el.nestCount;
@@ -189,7 +189,6 @@ export function migrateTemplate(template: string): {migrated: string|null, error
    result = migrateResult.tmpl;
    offset += migrateResult.offsets.pre;
    postOffsets.push(migrateResult.offsets.post);
-    const nm = el.el.name;
    nestLevel = el.nestCount;
  }


diff --git a/packages/core/schematics/test/control_flow_migration_spec.ts b/packages/core/schematics/test/control_flow_migration_spec.ts
@@ -1798,7 +1798,66 @@ describe('control flow migration', () => {
    });
  });

-  describe('template removal', () => {
+  describe('template', () => {
+    it('should migrate a root level template thats not used in control flow', async () => {
+      writeFile('/comp.ts', `
+        import {Component} from '@angular/core';
+        import {NgIf} from '@angular/common';
+
+        @Component({
+          selector: 'declare-comp',
+          templateUrl: './comp.html'
+        })
+        class DeclareComp {
+        }
+      `);
+
+      writeFile('/comp.html', [
+        `<div class="content">`,
+        `  <ng-container *ngTemplateOutlet="navigation" />`,
+        `  <ng-container *ngIf="content()">`,
+        `    <div class="class-1"></div>`,
+        `  </ng-container>`,
+        `</div>`,
+        `<ng-template #navigation>`,
+        `  <div class="cont">`,
+        `      <button`,
+        `        *ngIf="shouldShowMe()"`,
+        `        class="holy-classname-batman"`,
+        `      >`,
+        `        Wow...a button!`,
+        `      </button>`,
+        `  </div>`,
+        `</ng-template>`,
+      ].join('\n'));
+
+      await runMigration();
+
+      const content = tree.readContent('/comp.html');
+      const result = [
+        `<div class="content">`,
+        `  <ng-container *ngTemplateOutlet="navigation" />`,
+        `  @if (content()) {\n`,
+        `    <div class="class-1"></div>\n  `,
+        `}`,
+        `</div>`,
+        `<ng-template #navigation>`,
+        `  <div class="cont">`,
+        `      @if (shouldShowMe()) {`,
+        `<button\n       `,
+        `        class="holy-classname-batman"`,
+        `      >`,
+        `        Wow...a button!`,
+        `      </button>`,
+        `}`,
+        `  </div>`,
+        `</ng-template>`,
+
+      ].join('\n');
+
+      expect(content).toBe(result);
+    });
+
    it('should not remove a template thats not used in control flow', async () => {
      writeFile('/comp.ts', `
        import {Component} from '@angular/core';