2017-09-17 91 views
4

我從ng2-bootstrap使用AlertModule。在imports部分,如果我只是使用AlertModule,我會收到錯誤Value: Error: No provider for AlertConfig!。如果我使用AlertModule.forRoot(),則應用程序正常工作。爲什麼?爲什麼我必須在導入NgModule時使用AlertModule.forRoot()?

我app.module.ts

import { BrowserModule } from '@angular/platform-browser'; 
import { NgModule } from '@angular/core'; 
import { FormsModule } from '@angular/forms'; 
import { HttpModule } from '@angular/http'; 
import {AlertModule} from 'ng2-bootstrap/ng2-bootstrap'; 
import { AppComponent } from './app.component'; 

@NgModule({ 
    declarations: [ 
    AppComponent 
    ], 
    imports: [ 
    BrowserModule, 
    FormsModule, 
    HttpModule, 

    // AlertModule, /*doesn't work*/ 
    AlertModule.forRoot() /*it works!*/ 
    ], 
    providers: [], 
    bootstrap: [AppComponent] 
}) 
export class AppModule { } 

回答

3

forRoot命名爲靜態功能有其own purpose。它們用於應用程序級別的單例服務。

AlertModule沒有任何供應商。當您撥打forRoot時,它將返回一個ModuleWithProviders類型的對象,其中包括AlertModule本身及其聲明以及在AlertModule中使用的提供者。

這就是寫在的NgModule提供部分錯過了AlertModule - github source

import { CommonModule } from '@angular/common'; 
import { NgModule, ModuleWithProviders } from '@angular/core'; 
import { AlertComponent } from './alert.component'; 
import { AlertConfig } from './alert.config'; 

@NgModule({ 
    imports: [CommonModule], 
    declarations: [AlertComponent], 
    exports: [AlertComponent], 
    entryComponents: [AlertComponent] 
}) 
export class AlertModule { 
    static forRoot(): ModuleWithProviders { 
    return { ngModule: AlertModule, providers: [AlertConfig] }; 
    } 
} 

看。這意味着如果僅導入AlertModule則不提供providers。但是當您撥打forRoot時,它會返回AlertModule加上提供商AlertConfig

相關問題