Angular:如何注入抽象服务的多个实例 [英] Angular: how to inject multiple instance of abstract service

查看:15
本文介绍了Angular:如何注入抽象服务的多个实例的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我对 Angular 有点陌生,正在尝试理解高级开发人员编写的代码.如果我没有遵循标准的沟通习惯和语言,请原谅我.

我有一个抽象类 abstractDatService 和一个抽象方法 getEntities(),它的实现类为 impl1impl2

实现类如下:

@Injectable()导出类 impl1 扩展了 abstractDatService{私人实体:Modal[] = [{编号:1,类型:a",名称:a1"},{编号:2,类型:a",名称:a2"}];public getEntities(): Observable{返回(this.entities);}}

现在,在我的模块中,我尝试将服务注入为:

 提供者:[{提供:抽象数据服务,使用类:impl1},{提供:抽象数据服务,使用类:impl2}]

在这种情况下,当我尝试获取实体时,他们只返回 impl2 类的实体,而不是 impl1

我希望实现同时返回.

谁能帮我解决这个问题?

详细说明

我有一个组件来显示数据

HEAD1来自 impl1 的数据//这一行是一个常见的组件,其中有一个 ngFor on observable 返回.头2来自 impl2 的数据//这一行是一个常见的组件,其中在返回的 observable 上有一个 ngFor.

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

解决方案

根据评论

<块引用>

请详细说明.你想要他们两个是什么意思?您的意思是您希望注入的服务是两者的组合,以便 getEntities 返回两者的元素?

<块引用>

是的,我想以一种同时获取 impl1 和 impl2 模型数据的方式注入

你需要改变两件事.

第一个:您的提供者定义包含 multi: true

提供者:[{提供:抽象服务,useClass:Impl1Service,多:真实,},{提供:抽象服务,useClass:Impl2Service,多:真实,}]

2nd: 用数组处理多注入

 构造函数(@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

I am a bit new to Angular and trying to understand code written by a senior dev. pardon me if I do not follow with the standard communication practice and words.

I have an abstract class abstractDatService with an abstract method getEntities() which have the implementation classes as impl1 and impl2

Implementation class looks like :

@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);
  }
}

Now, in my module, I am trying to inject the service as :

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

In this case, when I try to get the entities they return me the entities from impl2 class only and not of impl1

I want the implementation to return both.

Can anyone help me figure out this?

EDIT :

To elaborate

I have the component where I am displaying the data in a way that

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.

The common component is the one that displays Data from impl1 and Data from impl2 Both

解决方案

As per the comments

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

You need to change 2 things.

1st: Your provider definition to include multi: true

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

2nd: Handle the multi Injection with array

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

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

Check the same on stackblitz: https://stackblitz.com/edit/angular-ivy-pwysue?file=src/app/app.module.ts

这篇关于Angular:如何注入抽象服务的多个实例的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆