错误：RouterModule.forRoot（）被调用两次

Question

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

  

core.js：1598错误错误：未捕获（按承诺）：错误：   RouterModule.forRoot（）调用了两次。延迟加载的模块应使用   RouterModule.forChild（）代替。

全局搜索显示我只打过一次RouterModule.forRoot。我的延迟加载模块称为RouterModule.forChild，并且是唯一的其他路由模块。

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

Answer 1

如果您只需要在RouterModule中导入SharedModule以便使用诸如routerLink之类的指令，则可以像这样简单地将其导入：

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

请确保在您应用的基本模块（通常为AppModule或您的情况下为AppRoutingModule）中使用RouterModule.forRoot(yourRoutes)进行导入，以便在ListComponent中使用链接工作正常。

在RouterModule API Docs

中查看更多

Answer 2

在我的情况下，问题是由IDE AppModule自动导入到page.modules.ts之一

您可以快速检查是否有问题：

1. 搜索AppModule
2. 从AppModule和main.ts之外的所有文件中查找所有导入
3. 删除它们和相应的导入语句。