Injection of Generic Services in Angular

yotube
0

Issue

Will Angular inject more than one instance of a generic Service if it is invoked across Component constructors using different Types?

I have a lot of Services that are going to provide the same functionality for different classes that all inherit from the same base class. I'd like to use Typescript's generic pattern MyService<T extends BaseClass> to handle this.

But I don't know how it jives with Angular's injector:

  1. Will the Angular injector create more than one instance of this service if it's injected into different components with different Types?
  2. Will the injector inject the same instance if it is called with the same type?

Code:

@Injectable
export class MyService<T> {
...
}

@Component
export class ComponentA {
constructor(alphaService MyService<Alpha>) {} <--Instance 1
}

@Component
export class ComponentB {
constructor(betaService MyService<Beta>) {} <----Instance 2?
}

@Component
export class ComponentA1 {
constructor(alphaService MyService<Alpha>) {} <---Instance 1?
}

Is this legal? Does the injector know to create two instances of MyService?


Solution

This is a simple solution:

// service and models
export class User {
firstName: string
}

export class Admin {
lastName: string
}

@Injectable()
export class GenericService<T>{
item: number = Math.random();
GetAll(): Array<T> {
let output = [];
console.log(this.item); // each instance has own value
return output;
}
}

Then set your service in module through useFactory:

providers: [
{ provide: 'UserService', useFactory: () => (new GenericService<User>()) },
{ provide: 'AdminService', useFactory: () => (new GenericService<Admin>()) },
],

and inject your service with @Inject decorator:

constructor(
@Inject('UserService') private userService: GenericService<User>,
@Inject('AdminService') private adminService: GenericService<Admin>
) { }

Keep in mind it is better to use InjectionToken ( OpaqueToken is deprecated) for your provider token.I have used string just for simplicity.



Answered By - Himen
Tags

Post a Comment

0Comments
Post a Comment (0)

#buttons=(Accept !) #days=(20)

Our website uses cookies to enhance your experience. Learn More
Accept !
To Top