Question

我正在使用AlertModule中的ng2-bootstrap。在imports部分，如果我只使用AlertModule，我会收到错误Value: Error: No provider for AlertConfig!。如果我使用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 { }

Answer 1

forRoot命名的静态函数有own purpose。它们用于应用程序级单例服务。

AlertModule中没有任何提供者。当您致电forRoot时，它会返回 ModuleWithProviders 类型的对象，其中包含AlertModule本身及其声明以及{{1}中使用的提供程序}。

这是AlertModule - github source

中的内容

AlertModule

查看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] }; } }的提供者部分是否遗漏。这意味着如果仅导入NgModule，则不会提供AlertModule。但是，当您在其上调用providers时，它会向提供商forRoot返回AlertModule添加内容。

为什么我必须在导入NgModule时使用AlertModule.forRoot（）？

1 个答案: