angular - 错误 : RouterModule. forRoot() 调用了两次

标签 angular angular-router

我有一个组件 ListComponent 需要在 2 个模块中使用,其中一个是延迟加载的。所以我创建了声明 ListComponent 的 SharedModule。 ListComponent 使用 routerLink 指令,因此它需要 RouterModule。所以我导入了 RouterModule,导致了这个错误。

core.js:1598 ERROR Error: Uncaught (in promise): Error: RouterModule.forRoot() called twice. Lazy loaded modules should use RouterModule.forChild() instead.

全局搜索显示我只调用了一次 RouterModule.forRoot。我的延迟加载模块调用 RouterModule.forChild 并且是唯一的其他路由模块。

我使用完全相同的设置创建了一个 stackblitz,但无法重现该问题。它确实有效。尽管如此,我还是无法弄清楚我的项目有什么不同。 https://stackblitz.com/edit/angular-shared-component-b

最佳答案

如果您只需要在 SharedModule 中导入 RouterModule 以便使用诸如 routerLink 之类的指令,您可以像这样简单地导入它:

// ...
@NgModule({
  imports: [RouterModule], //  <-- without the .forRoot call
})
export class SharedModule { }
// ...

确保在你的应用程序的基础模块中(通常是 AppModule,或者在你的情况下可能是 AppRoutingModule)你使用 RouterModule.forRoot(yourRoutes) 导入它 因此 ListComponent 中使用的链接可以正常工作。

查看更多信息 RouterModule API Docs

关于angular - 错误 : RouterModule. forRoot() 调用了两次,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50953337/

相关文章:

javascript - 导航时是否可以防止破坏Angular组件?

Angular 2+ : How to access active route outside router-outlet

Angular 强类型 react 形式

javascript - 去掉每个文件angular 6的文件扩展名

Angular 2仅对当前悬停的元素进行动画处理

angular - 在 Angular 中具有多个参数的 RouterLink

angular - 激活的路由 URL 始终为空

android - 如何减少 IONIC 2 应用程序的启动时间?

Angular 2/4 : Reactive forms are synchronous while template-driven forms are asynchronous, 怎么办?

javascript - 将 Angular Router 渲染 URL 粘贴到浏览器中?