Question

我有一个带有资源服务的共享模块。在我的app.module中，我想导入此模块并使用值初始化资源服务。因此，我在share.module中定义的组件可以使用资源（翻译）。

P.S。我不想在app.module的提供程序中初始化资源服务。共享模块应该是独立的。

share.module.ts

 @NgModule({
    declarations: [ ComponentA, ComponentB],
    providers: [ResourceService], ...

app.module.ts

import [ ShareModule ]

app.component.ts

ngOnInit()
{
    this.http.get("resource").subscribe(resource => {
       // init resource service of share module here
    }
}

您能告诉我我如何实现吗？

最诚挚的问候

Answer 1

使用{providedIn: 'root'}来提供服务：

@Injectable({
  providedIn: 'root'
})

export class ResourceService {}

然后将其从providers中删除。

然后创建另一个类，该类将保存SharedModule的配置：

// Change this for your needs
export abstract class SharedConfig {
  readonly api: string;
}

然后在您的forRoot类上创建一个SharedModule：

export class SharedModule {

  public static forRoot(configFactory, deps = []): ModuleWithProviders {

    return {
      ngModule: SharedModule,
      providers: [
        {provide: SharedConfig, useFactory: configFactory, deps: deps}
      ]
    };
  }
}

然后将其命名为：

imports: [SharedModule.forRoot({api: 'https://foo.com/api'})]

现在在您的服务中，您可以像这样注入此配置：

constructor(private config: SharedConfig) {
  // logs 'https://foo.com/api'
  console.log(config.api);
}

这将使您能够从forRoot调用中获取值。

Answer 2

As Angular documentation says:

获得共享服务的最常见方法是通过角度依赖注入，而不是通过模块系统（导入模块将产生一个新的服务实例，即不是典型的用法）。

创建可注射服务：

import { Injectable } from '@angular/core';


@Injectable({
  // we declare that this service should be created
  // by the root application injector.
  providedIn: 'root',
})
export class YourService {
  getYourData() { /* make here http call...;*/ }
}

然后您可以在构造函数中使用依赖项注入：

constructor(yourService: YourService) {
}

然后您致电该服务的任何地方：

this.http.get("resource").subscribe(resource => {
   // call your service
   this.fooData = yourService.getYourData();

}

具有值的Angular 2初始化服务

2 个答案: