How to update the useClass in providers based on the condition in Angular

Question

I am trying to update the useClass based on the condition. When I am trying to change the tab I want to update the service. So I wrote one factory function for that.

let useClassFactory = ( conn: service1, svc: service2, object: any ) => { let path = typeof object == 'string' ? object : object?.path if (path === 'connections') { return conn } else if (path === 'services') { return svc } else { return conn } } @Component({ selector: 'cmpnt-form', templateUrl: './cmpnt-form.component.html', changeDetection: ChangeDetectionStrategy.OnPush, providers: [ { provide: QPService, // useClass: SvcService, useFactory: useClassFactory, deps: [ConnService, SvcService] }, { provide: TableService, useClass: TableService, deps: [QPService] } ] }) onTabClick(path: any) { useClassFactory(this.ConnService, this.svcService, path) this.getColumns(path).subscribe({ next: (data: ModelAsTableColumns[]) => { this.columns = data this.dataSource = [] }, error: (err) => {} }) }

Factory function is working and returning proper service based on the path. But when I am hitting the API it's going to the default service only. Do I have to update anything after factory fucntion?

I tried to use the different services inside the useClass based on the tab click. But it's hitting the same API.

Naren Murali · Accepted Answer · 2024-01-09 07:01:29Z

0

Why do you need a factory for this, a simple getter method will be enough right?

get conditionalService() { return this.path === 'connections' ? this.ConnService : this.svcService; }

Then you can use it like so

(this.conditionalService as ConnectionService).getColumns();

answered Jan 9, 2024 at 7:01

Naren Murali

66.2k6 gold badges51 silver badges96 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

Saravanan Over a year ago

No. I want the useClass should be changed based on the condition. That's why I wrote the factory function.

Saravanan Over a year ago

Hope you understand my question @Naren Murali

Naren Murali Over a year ago

@Saravanan You cannot reinitialize the provider as far as I know stackblitz what you have asked in the question is the equivalent of what I have answered!

Saravanan Over a year ago

Ok. Thanks. What about the dynamic imports?

Naren Murali Over a year ago

@Saravanan please include the details on the question, maybe someone will answer!, I am not familiar with dynamic imports

|

Saravanan · Accepted Answer · 2024-01-10 06:35:46Z

Indeed, services cannot be reinitialized after the component has rendered. I've discovered an alternative solution. I'm utilizing child components dedicated to specific services and dynamically rendering them based on the selected tab.

Collectives™ on Stack Overflow

How to update the useClass in providers based on the condition in Angular

2 Answers 2

6 Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

6 Comments

Comments

Related