0

我有一个有趣的问题。我有 2 个模块。app.module.ts (AppModule) 和 Listings.module.ts (ListingsModule)。ListingsModule 有一个服务,我们称之为服务 A。A 需要是一个单例全局服务,这意味着所有其他组件和服务都需要能够与同一个 A 交互。

为此,我首先尝试在 ListingsModule 中将 A 声明为提供程序,但这并没有按预期工作,因为它仅被声明为用于 ListingsModule 下的组件和服务的单例,但我还需要在其他模块和 AppModule 下使用它. 因此,我得出结论,我需要从 ListingsModule 导出此服务并在 AppModule 下导入并提供此服务,但这并没有按预期工作。

A 是 ListingsStoreService。

//Stores
import { ListingsStoreService }             from './shared/listings-store.service';

//Modules
import { SharedModule }                                 from './../shared/shared.module';
import { HeaderModule }                                 from './../header/header.module';

@NgModule({
    imports: [
        SharedModule,
        HeaderModule,
        ListingsRoutingModule
    ],
    declarations: [
        ListingsComponent
    ],
    exports: [
        ListingsStoreService
    ],
    providers: [        ]
})
export class ListingsModule {
}

以下代码要求我声明或导入 ListingsStoreService,使其可导出。如果我声明 ListingsStoreService 那么它会给我另一个错误。我显然只能提供这项服务。

这里的正确方法是什么?我该如何进行这项工作?

4

3 回答 3

1

Angular 对它的一些模块(例如RouterModule)所做的是允许创建同一个模块的两个版本,按照惯例,通过称为“forRoot”和“forChild”的静态函数。“forRoot”可以包含一个全局服务,例如它的提供者数组中的“ListingsStoreService”,而“forChild”会省略它。然后您可以在 AppModule 导入数组中调用“ListingsModule.forRoot()”,并在需要“ListingsModule”的其他任何地方调用“ListingsModule.forChild()”。

@NgModule({
imports: [
    SharedModule,
    HeaderModule,
    ListingsRoutingModule
],
declarations: [
    ListingsComponent
]
})
export class ListingsModule {
    static forRoot() : ModuleWithProviders {
        return {
            ngModule: ListingsModule,
            providers: [ ListingsStoreService ]
        };    
    };

    static forChild() : ModuleWithProviders {
        return {
             ngModule: ListingsModule,
             providers: []
        };
    };
};
于 2017-02-06T10:55:49.273 回答
0

您的 ListingsStoreService 必须导入

imports: [
    SharedModule,
    HeaderModule,
    ListingsRoutingModule,
    ListingsStoreService
],

我认为这是你的问题。你能试试这个吗?我已经写了评论,但我需要 50 名声望……所以这是一个我不知道 100% 是否有效的答案。

于 2017-02-06T09:19:50.673 回答
0

它应该在没有特殊配置的情况下工作。默认情况下,服务具有全局范围(只要声明它们的模块是热切加载的)。您的初始配置(您在问题中描述的)应该可以工作。

在以下提供者中声明您的服务ListingsModule

@NgModule({
  providers: [ ListingsStoreService ]
})
export class ListingsModule {
}

然后导入ListingsModuleAppModule

@NgModule({
  imports: [ ListingsModule ]
})
export class AppModule {
}

注意。ListingsModule必须急切加载,而不是延迟加载。您的问题并没有说明ListingsModule您的情况是如何加载的。

于 2017-02-06T10:22:23.117 回答