4

我试图找到一种构建 Angular 2 应用程序的好方法。Angular 2 风格指南推荐创建一个核心模块。如果我理解正确,核心模块的目标是收集一次性类和组件并保持根模块纤细。还有写的是我应该将资产所需的所有模块导入核心模块。

对于需要包含在方法 forRoot() 中的第三方库(如 NgBootstrap 或 angular2-notifications),我有点困惑。通常只应在根模块中调用 forRoot() 方法。我应该在根模块还是核心模块中包含这些模块?

在下面的示例中,我需要对 angular2-notifications 进行一些配置。为了让我的根模块保持苗条,我在核心模块中导入了 SimpleNotifications。

  • 这是正确的方法吗?为了使应用程序工作,我仍然需要在应用程序模块中导入 SimpleNotificationsModule.forRoot()。
  • 为什么我需要在核心模块中再次导入 SimpleNotificationsModule。它不应该由应用程序模块提供。我认为感谢 forRoot() 他们的核心模块使用与应用程序模块相同的导入模块?
  • 如果是,我应该在核心模块中导入 SimpleNotifications 吗?我真的应该在那里调用 forRoot() 方法吗?

应用模块

...
import {SimpleNotificationsModule} from 'angular2-notifications';

@NgModule({
    declarations: [...],
    imports: [
     BrowserModule,
     CoreModule,
     NgbModule.forRoot(),
     SimpleNotificationsModule.forRoot(),
    ],
    bootstrap: [AppComponent]
})
export class AppModule {}

应用组件

...
<notifications></notifications>

核心模块

import {SimpleNotificationsModule} from 'angular2-notifications';
import {NotificationsComponent} from 
'./notifications/notifications.component';

@NgModule({
  imports: [
    CommonModule,
    FormsModule,
    HttpModule,
    RouterModule,
    SimpleNotificationsModule
 ],
  declarations: [...],
  exports: [NotificationsComponent]
})
export class CoreModule {
  constructor(@Optional() @SkipSelf() parentModule: CoreModule) {
    throwIfAlreadyLoaded(parentModule, 'core module');
 }
}

通知组件

import {Component, ViewEncapsulation} from '@angular/core';

@Component({
   selector: 'notifications',
   template: `<simple-notifications [options]="notificationOptions">
   </simple-notifications>`,
   styleUrls: ['./notifications.component.css'],
   encapsulation: ViewEncapsulation.None
})
export class NotificationsComponent {

  public notificationOptions = {
    position: ['top', 'right'],
    timeOut: 5000,
    maxStack: 5,
    lastOnBottom: true
  };
}
4

1 回答 1

1

.forRoot() 用于为模块中的服务注册提供者。

  • 如果您需要从模块中引用组件/指令或模型,则在没有 forRoot() 的情况下导入模块。在应用程序中导入模块的时间没有限制。
  • 如果您需要从模块提供服务,请使用 forRoot() 导入模块。通常,我们以这种方式导入模块只是为了将服务用作单例。

总之,forRoot() 约定代表了一种使用 ModuleWithProviders 接口导入 NgModule 及其提供程序的方法。 NgModule forRoot() 约定

核心模块通常也用于故事单例(如身份验证服务、日志记录、通知服务)和仅使用一次的组件(应用程序标题、导航栏、通知栏)。该模块仅将一个导入应用程序的根目录。

现在你的问题:

在核心模块中简单导入 SimpleNotificationsModule.forRoot(),并确保在 App 模块中导入核心模块。无需将 SimpleNotificationsModule 导入 App 模块。此外,您可以从 App 模块中删除 NgbModule.forRoot() 并将其放入核心模块导入中。

如果您有功能模块(如 UserManagementModule),那么您可以导入 SimpleNotificationsModule(不带 .forRoot()),并且您将拥有通知组件的所有引用,而无需创建通知服务的第二个实例。

于 2018-11-14T19:04:53.463 回答