angularangular-migrationngtemplateoutlet

Angular Control flow migration removes CommonModule even when needed


I'm migrating an Angular project to use the new control-flow syntax (@if, @for, etc.) using the @angular/core:control-flow-migration schematic.

After running the migration, I noticed that the schematic sometimes removes CommonModule from standalone components, even though the template still uses ngTemplateOutlet. This breaks the component at runtime.

I expected the migration to keep CommonModule if any directives or pipes it provides are still used.

// app.component.ts
import { Component, TemplateRef, ViewChild } from '@angular/core';

@Component({
  standalone: true,
  selector: 'app-root',
  template: `
    <ng-template #tpl>
      <p>Hello Template!</p>
    </ng-template>

    <ng-container [ngTemplateOutlet]="tpl"></ng-container>
  `,
  // CommonModule was removed by the migration
  // imports: [CommonModule]
})
export class AppComponent {
  @ViewChild('tpl') tpl!: TemplateRef<any>;
}

After migration, the component no longer imports CommonModule, which is required for ngTemplateOutlet.

Two questions:

  1. Is this a known issue with the @angular/core:control-flow-migration schematic?
  2. Is there a recommended way to safely migrate standalone components without breaking them when CommonModule needed?

Solution

  • This is a bug that existed prior to 19.1.6, and has been fix by this commit that landed with the 19.1.6 release.