Angular2 DI: How to introduce dependency in @NgModule?

TL DR 10/25/16: update

I renamed the name to give more clarification as I am still concerned about the correct solution.

Given the module

@NgModule({
  imports: [
    ExternalModule.forRoot(config),
  ],
  providers: [EXTERNAL_PROVIDERS(config)],
})
export class MyModule{}

So my questions are: is there any way that I can make a dependency with my passed config like this?

  • ExternalModule.forRoot(@Inject(MyConfig) config : MyConfig)
  • providers: [EXTERNAL_PROVIDERS(@Inject(MyConfig) config)] (

I do not want to create {provide: xxx, deps :[xxx], useFactory : xxx}for each given external provider.

I tried to initialize Application Wide Service Locatorwith access to the root injector, as described here , but with Angular 2.1.0 it ngDoBootstrapdoes not work as expected.

----------

Old post:

I would like to know what the correct template is for setting up an external third-party library provider in Angular2.

Take an example (code examples in Typescript):

, :

export function THIRD_PARTY_PROVIDERS(config = {}): Provider[] {
  return [
    {
      provide: ExtConfigurableService,
      deps: [Http],
      useFactory: (http: Http) => {
        return new ExtConfigurableService(http, config);
      }
    },
    ExtOtherService
  ];
}

@NgModule:

@NgModule({
  providers: [
    THIRD_PARTY_PROVIDERS({foo : 'bar'})
  ],
})
export class ClientModule { }

, , MyService? . - FactoryProvider:

const myConfigProvider = {
    provide: MyConfig,
    deps: [MyService],
    useFactory: (MyService) => {
      return new MyConfig(MyService);
    }
  };

, MyConfig THIRD_PARTY_PROVIDERS?


, , :

: , factory.

, / lib .

@NgModule({
      providers: [
        {provide: ExtConfigurableService, deps: [MyConfig], useFactory: ...},
        ExtOtherService
      ],
    })
    export class ClientModule { }

Angular 2 ( )?


19.10.16

, . , / fork repo.

-lib.ts:

   export const JWT_CONFIGURATION = new OpaqueToken('THIRD_PARTY_PROVIDER_TOKEN');
    ...

    @Injectable()
    export class ExtConfigurableService {

      constructor(@Inject(JWT_CONFIGURATION) config: any) {
        // do someting with client provided config 
      }

-module.ts

 @NgModule({
      providers: [
        {
        provide: JWT_CONFIGURATION,
        deps: [MyService],
        useFactory: (mySvc: MyService) => {
          return {foo : 'bar'};
        }, THIRD_PARTY_PROVIDERS
      ]
    })
    export class MyModule { }

, (, ), , myconfig.

Angular 2 @Inject() factory?

+4

Source: https://habr.com/ru/post/1658079/


All Articles