NullInjectorError: R3InjectorError(AppModule)[路由器->路由器->路由器]：NullInjectorError:没有路由器提供程序

Question

我有一个已发布的库，其中包含一个在其模板中使用routerLink的组件。在我的应用程序中安装了这个库之后，我得到了错误NullInjectorError: R3InjectorError(AppModule)路由器-> ->路由器: NullInjectorError: No for路由器！

在库中的模块中导入RouterModule，如下所示：

@NgModule({
  declarations: [
    Component
  ],
  exports: [
    Component
  ],
  imports: [
    CommonModule,
    RouterModule,
    TranslateModule
  ]
})
export class LibWithComponentModule {
}

在我的应用程序中，RouterModule配置如下：

const routes: Routes = [{
  path: '',
  component: RootComponent
}];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }

app.module.ts看起来如下所示：

  declarations: [
    AppComponent,
    RootComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    LibWithComponentModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

但我以为RouterModule会被提供？我做错了什么？

Answer 1

使用@angular/router的服务也出现了同样的错误。我可以通过替换

@Injectable()

使用

@Injectable({
  providedIn: 'root'
})

在服务类里面。

Answer 2

对我来说，问题有点像@NilsTitjgat explained，但我不得不将库保留为dependency。

如果像我一样，您必须这样做，那么问题在于您的应用程序导入了导入到这个库中的库的另一个版本。

意思是如果

MainApp

"dependencies": { 
  "@my/lib": "1.0.0",
  "@another/lib": "1.0.0" 
}

@my/lib

"dependencies": { 
  "@another/lib": "1.2.0"  // <-- The version is higher
}

那么您将面临同样的错误。解决这一问题的方法是将@another/lib版本从1.0.0插入到1.1.0。

是的，你不应该这样进口它。如果可以的话，把它放在@NilsTitjgat提到的peerDependencies下面

Answer 3

将HttpClient导入到.service.ts中

import { HttpClient } from '@angular/common/http';

将HttpClientModule导入app.module.ts并将HttpClientModule添加到imports数组中

import { HttpClientModule } from '@angular/common/http';

 imports: [
    BrowserModule,
    AppRoutingModule,
    HttpClientModule
  ],