Angular: 如何注入抽象服务的多个实例

Question

我对 Angular 有点陌生，正在尝试理解高级开发人员编写的代码。如果我不遵循标准的沟通习惯和措辞，请原谅我。

我有一个带有抽象方法 getEntities() 的抽象 class abstractDatService，其实现 classes 为 impl1 和 impl2

实现 class 看起来像：

@Injectable()
export class impl1 extends abstractDatService{
  
  private entities: Modal[] = [
    {
      id: 1,
      type: "a",
      name: "a1"
    },
    {
      id: 2,
      type: "a",
      name: "a2"
    }
  ];

  public getEntities(): Observable<Modal[]> {
    return of(this.entities);
  }
}

现在，在我的模块中，我尝试将服务注入为：

  providers: [
    {
      provide: abstractDatService,
      useClass: impl1
    },
    {
      provide: abstractDatService,
      useClass: impl2
    }
  ]

在这种情况下，当我尝试获取实体时，他们 return 我只从 impl2 class 而不是 impl1

的实体

我希望实现 return 两者。

谁能帮我解决这个问题？

编辑：

详细说明

我有组件以

的方式显示数据

HEAD1
Data from impl1 // this line is a common component in which there is a ngFor on observable returned.

HEAD2
Data from impl2 // this line is a common component in which there is a ngFor on observable returned.

公共组件是显示来自 impl1 的数据和来自 impl2 的数据的组件

Answer 1

根据评论

Please elaborate. what do you mean with you want them both? Do you mean you want the injected service to be a combination of both, so that getEntities returns the elements from both?

Yes I want to inject in a way that I get data for both models impl1 and impl2

你需要改变两件事。

1st：您的提供商定义要包括 multi: true

providers: [
    {
      provide: AbstractionService,
      useClass: Impl1Service,
      multi: true,
    },
    {
      provide: AbstractionService,
      useClass: Impl2Service,
      multi: true,
    }
  ]

第二：用数组处理多重注入

 constructor(@Inject(AbstractionService) impls: AbstractionService[]) {
    const obs$ = impls.map(impl => impl.getEntities());

    combineLatest(obs$).subscribe(console.log);
  }

在 stackblitz 上检查同样的内容：https://stackblitz.com/edit/angular-ivy-pwysue?file=src/app/app.module.ts

Angular: 如何注入抽象服务的多个实例

Angular: how to inject multiple instance of abstract service

javascript

dependency-injection

typescript

angular-directive

angular