如何將帶有提供程序的功能模塊導入到另一個帶有提供程序的功能模塊？

Question

有一個我喜歡的功能模塊，或者我想將其用作我自己的功能模塊的一部分。 我想要包含的子模塊稱為SlimLoadingBarModule 。 我想將它用作基礎，並通過在其頂部提供我自己的功能來使用它的功能。 此外，我的整個應用程序可以使用我的LoadingBarComponent和LoadingBarService並且不需要了解底層提供程序。

所以最后我希望能夠像這樣將它注入到我的服務中：

@Injectable()
export class LoadingBarService {

    constructor(private slimLoadingBarService: SlimLoadingBarService) {}

    start() {}

    finish() {}

    /**/ 

}

為此，我必須以某種方式將它包含在我的模塊中

import { NgModule, ModuleWithProviders } from '@angular/core';

import { SlimLoadingBarModule } from 'ng2-slim-loading-bar';

import { LoadingBarComponent } from './loading-bar.component';
import { LoadingBarService } from './loading-bar.service';

@NgModule({
    imports: [ SlimLoadingBarModule.forRoot() ],
    declarations: [ LoadingBarComponent ],
    exports: [ LoadingBarComponent ]
})
export class LoadingBarModule {

    static forRoot(): ModuleWithProviders {
        return {
            ngModule: LoadingBarModule,
            providers: [ LoadingBarService ]
        };
    }

}

模板只包含SlimLoadingBar的標簽

---

問題

盡管我自己的服務在我的模塊中都是單例的，但我不能讓SlimLoadingBarService成為單例。 我總是得到兩個實例，如果我不將它注入到我的服務中，我會得到 1 個實例，但是我無法使用它。

此外，我知道我的服務和組件正在工作，因為我以某種方式讓它們工作了一次，但我沒有發現模塊和導入的邏輯足以讓它們保持這樣。

我已經嘗試了各種解決方案，通過SharedModule ，通過AppModule但無論我似乎做什么，當我嘗試將它注入我的LoadingBarService我有 2 個實例！

但我覺得一個功能模塊應該不可能使用一些額外的底層提供者，並且可能將它們隱藏在應用程序的其余部分之外？ 甚至有可能嗎？ 如果是這樣，那么我做錯了什么？

Answer 1

forRoot()應該只在AppModule

@NgModule({
    imports: [ SlimLoadingBarModule.forRoot() ],

https://angular.io/docs/ts/latest/guide/ngmodule.html#!#core-for-root

呼叫forRoot僅在根應用模塊， AppModule 。 在任何其他模塊中調用它，特別是在延遲加載的模塊中，與意圖相反，並且可能會產生運行時錯誤。

記得導入結果； 不要將它添加到任何其他 @NgModule 列表中。