Question

我的项目需要以下模块：

TranslateModule LocalizeRouterModule TransferHttpCacheModule

不知何故，这种模块组合正在创建循环依赖。

TranslateModule与TransferHttpCacheModule - 有效 TranslateModule与LocalizeRouterModule - 工作

但是当我导入所有三个时，它会导致依赖循环。

无法实例化循环依赖！ ApplicationRef（“[ERROR - ＆gt;]”）：在./AppBrowserModule@-1：1中的NgModule AppBrowserModule中

检查plnkr是否有问题的再现：https://plnkr.co/edit/qlUQ866JzTa3JtFgSAIO?p=preview

@NgModule({
imports: [
    HttpClientModule,
    BrowserModule,
    BrowserAnimationsModule,
    TransferHttpCacheModule,
    TranslateModule.forRoot({
      loader: {
        provide: TranslateLoader,
        useFactory: HttpTranslationLoaderFactory,
        deps: [HttpClient]
      }
    }),
    LocalizeRouterModule.forRoot([], {
      parser: {
        provide: LocalizeParser,
        useFactory: HttpLoaderFactory,
        deps: [TranslateService, Location, LocalizeRouterSettings]
      }
    }),
    RouterModule.forRoot([])
],
declarations: [
    AppComponent
],
providers: [

],
bootstrap: [AppComponent]
}) export class AppModule { }

Answer 1

您不需要在导入下使用LocalizeRouterModule，因为它可以注入导致循环depdendency的提供程序。

修复如下，

@NgModule({
    imports: [
        HttpClientModule,
        BrowserModule,
        BrowserAnimationsModule,
        TransferHttpCacheModule,
        TranslateModule.forRoot({
          loader: {
            provide: TranslateLoader,
            useFactory: (createTranslateLoader),
            deps: [HttpClient]
          }
        }),

        RouterModule.forRoot([])
    ],
    declarations: [
        AppComponent,
        LocalizeRouterPipe
    ],
  providers: [TranslateModule  ],
    bootstrap: [AppComponent]
})

<强> PLUNKER

如果您需要有效的回购，请将其视为 example

循环依赖性错误TransferHttpCacheModule，LocalizeRouterModule，TranslateModule

1 个答案: