fix(migrations): generate forwardRef for same file imports (#48898)

Adds some logic that will generate a `forwardRef` if necessary when adding imports.

PR Close #48898

Author: crisbeto

packages/core/schematics/ng-generate/standalone-migration/to-standalone.ts

@@ -119,7 +119,18 @@ function getComponentImportExpressions(
             ref.node.getSourceFile(), importLocation.symbolName, importLocation.moduleSpecifier);
         imports.push(identifier);
       } else {
-        imports.push(ts.factory.createIdentifier(importLocation.symbolName));
+        const identifier = ts.factory.createIdentifier(importLocation.symbolName);
+
+        if (importLocation.isForwardReference) {
+          const forwardRefExpression =
+              tracker.addImport(ref.node.getSourceFile(), 'forwardRef', '@angular/core');
+          const arrowFunction = ts.factory.createArrowFunction(
+              undefined, undefined, [], undefined, undefined, identifier);
+          imports.push(
+              ts.factory.createCallExpression(forwardRefExpression, undefined, [arrowFunction]));
+        } else {
+          imports.push(identifier);
+        }
       }
 
       seenImports.add(importLocation.symbolName);

packages/core/schematics/test/standalone_migration_spec.ts

@@ -1254,6 +1254,46 @@ describe('standalone migration', () => {
     `));
   });
 
+  it('should generate a forwardRef for forward reference within the same file', async () => {
+    writeFile('decls.ts', `
+      import {Component, Directive} from '@angular/core';
+
+      @Component({
+        selector: 'comp',
+        template: '<div my-dir></div>'
+      })
+      export class MyComp {}
+
+      @Directive({selector: '[my-dir]'})
+      export class MyDir {}
+    `);
+
+    writeFile('module.ts', `
+      import {NgModule} from '@angular/core';
+      import {MyComp, MyDir} from './decls';
+
+      @NgModule({declarations: [MyComp, MyDir]})
+      export class Mod {}
+    `);
+
+    await runMigration('convert-to-standalone');
+
+    expect(stripWhitespace(tree.readContent('decls.ts'))).toEqual(stripWhitespace(`
+      import {Component, Directive, forwardRef} from '@angular/core';
+
+      @Component({
+        selector: 'comp',
+        template: '<div my-dir></div>',
+        standalone: true,
+        imports: [forwardRef(() => MyDir)]
+      })
+      export class MyComp {}
+
+      @Directive({selector: '[my-dir]', standalone: true})
+      export class MyDir {}
+    `));
+  });
+
   it('should remove a module that only has imports and exports', async () => {
     writeFile('app.module.ts', `
       import {NgModule} from '@angular/core';