NG3003：Angular 12 库在Ivy partial编译模式下循环依赖问题咨询

可选方案 #

• 方案1：使用forwardRef打破编译期循环检测
  无需调整文件结构，仅需要在互相引用的位置用forwardRef包装依赖即可，适合批量处理大量同类场景：
  1. 独立组件场景下，在组件元数据的imports数组中用forwardRef包装依赖的另一个组件
  2. 构造函数注入另一个组件实例时，搭配@Inject和forwardRef声明依赖
     示例代码：

  // child.component.ts
  import { Component, Inject, forwardRef } from '@angular/core';
  import { ParentComponent } from './parent.component';
  
  @Component({
    selector: 'app-child',
    standalone: true,
    // 用forwardRef包装导入的父组件
    imports: [forwardRef(() => ParentComponent)]
  })
  export class ChildComponent {
    constructor(
      // 注入时同样用forwardRef包装
      @Inject(forwardRef(() => ParentComponent)) 
      private parent: ParentComponent
    ) {}
  }
  

  父组件侧如果也有直接导入子组件的逻辑，做相同的处理即可。
• 方案2：抽象层解耦（推荐长期维护使用）
  提取公共抽象类或注入令牌作为中间层，两个组件都依赖中间层而非直接互相依赖，从根源消除循环导入：
  1. 新建独立的抽象层文件，定义双方需要调用的公共方法/属性签名：

  // parent.abstract.ts
  export abstract class AbstractParent {
    // 声明子组件需要用到的父组件能力
    abstract getConfig(): Record<string, any>;
    abstract onChildEvent(data: unknown): void;
  }
  

  2. 父组件实现抽象层，同时在自身providers中注册实现：

  // parent.component.ts
  import { Component } from '@angular/core';
  import { AbstractParent } from './parent.abstract';
  import { ChildComponent } from './child.component';
  
  @Component({
    selector: 'app-parent',
    standalone: true,
    imports: [ChildComponent],
    providers: [
      { provide: AbstractParent, useExisting: ParentComponent }
    ]
  })
  export class ParentComponent implements AbstractParent {
    getConfig() {
      return { /* 原有逻辑 */ }
    }
    onChildEvent(data: unknown) {
      // 原有逻辑
    }
  }
  

  3. 子组件不再直接导入父组件，改为依赖抽象层：

  // child.component.ts
  import { Component, Inject } from '@angular/core';
  import { AbstractParent } from './parent.abstract';
  
  @Component({
    selector: 'app-child',
    standalone: true
  })
  export class ChildComponent {
    constructor(private parent: AbstractParent) {}
  }
  

• 方案3：统一模块声明适配
  如果你使用的是NgModule而非独立组件，将两个互相依赖的组件都放到同一个NgModule的declarations数组中统一声明，不需要在组件元数据的imports中单独引入对方，编译器会自动识别同一模块下的组件，不会触发循环导入检测。

上述所有方案都可以保留compilationMode: "partial"的配置，不影响库的向下兼容性，也不需要将多个组件合并到同一个文件中。

内容的提问来源于stack exchange，提问作者Shadowalker