angular - 组件提供者和模块提供者的区别

Question

@Components providers 属性和@Module providers 有什么区别？

两者代表什么？

编辑

我有两个组件:LoginComponent 和 SigninComponent。另一方面，我使用的是来自定制库的 UserService。此 UserService 服务正在寻找一个不透明 token BASE_PATH:

@Injectable()
export class UsersService {
    constructor(@Optional()@Inject(BASE_PATH)

BASE_PATH 是:

export const BASE_PATH = new OpaqueToken('basePath');

这个 opaqueToken 在 AppModule 上设置:

@NgModule({
  bootstrap: [ App ],
  declarations: [
    App,
    ErrorComponent
  ],
  providers: [
    ENV_PROVIDERS,

其中 ENV_PROVIDERS 是根据 environtment.ts 上的环境设置设置的:

if ('production' === ENV) {
  enableProdMode();

  PROVIDERS = [
    ...PROVIDERS,
    // custom providers in production
    { provide: BASE_PATH, useValue: 'http://public.sample.com:8082/commty/cmng' }
  ];

} else {

  // Development
  PROVIDERS = [
    ...PROVIDERS,
    // custom providers in development
    { provide: BASE_PATH, useValue: 'http://localhost:8082/commty/cmng' }
  ];

}

export const ENV_PROVIDERS = [
  ...PROVIDERS
];

我正在设置所有:

@NgModule({
  declarations: [
    SigninComponent
  ],
  providers: [ UsersService ]
})
export default class SigninModule {

和

@NgModule({
  declarations: [
    LoginComponent
  ],
  providers: [ UsersService ]
})
export default class LoginModule {

因此，在组件上，我不导入任何服务作为提供者，我只声明它们。

然而，当我加载 SigninModule 时，我所有的网络请求都会发送到 localhost。但是，当我加载 LoginModule 时，请求被发送到 localhost:8282

Answer 1

如果您在组件内部提供服务，它将是本地服务。因此，如果您有两个组件实例，您将有两个服务实例。

现在，如果您在模块内提供服务，它将是全局的，并且如果您有两个组件实例，它们将共享同一个服务实例。

如果你不明白告诉我，我会给你一个plunker的例子。