javascript - 在 Angular 的同一父路由下加载多个模块

标签 javascript angular module router

我正在寻找一种方法,通过它我可以在 Angular 中的相同 path 下加载多个模块。例如,假设我有三个模块 AModuleBModuleCModule,每个模块都有自己的 RouterModule.forChild 调用。现在我想在 say site 路由下安装所有这些模块。

我实现此目的的一种方法是将路由包装在 site 路由下的 RouterModule.forChild 调用中,如下所示:

RouterModule.forChild([
  {
     path: 'site',
     children: [{}] // children goes here
  }
])

我不知道这种方法是否正确,但它工作正常。这种方法的唯一问题是我必须在每个要安装在 site 下的模块中指定 canActivate。虽然这不是问题,但我一直在寻找更简洁的解决方案。

我知道有一个属性 loadChildren 可以用来延迟加载模块。但是我想急切地加载模块。

我正在使用 AngularCLI,它将我在 loadChildren 中指定的模块代码拆分到一个单独的 JavaScript 文件中,这不是我想要的。

我正在使用 AngularClI v1.2.0 和 Angular v4.2.5。

非常感谢任何帮助。

谢谢

最佳答案

我并不完全清楚您的目标以及您最终想要实现的目标,但这里有一些想法。

您可以使用 loadChildren 和“延迟加载”来按需加载或急切加载。如果您选择预先加载的路线,一旦您的主路线被加载并显示您的第一个 View ,其他标记为预先加载的模块将立即异步加载。

我这里有一个例子:https://github.com/DeborahK/Angular-RoutingAPM-Final 文件夹中。

我不清楚您为什么不想拆分模块。它可以显着提高应用程序的启动性能(显示第一页的时间)。

除了 canActivate 之外,还有一个 canActivateChild,因此您可以将它放在父级上,而不必为每个路由重复它。文档在这里:https://angular.io/api/router/CanActivateChild

关于javascript - 在 Angular 的同一父路由下加载多个模块,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45824772/

相关文章:

javascript - Angular Material 6 Mat-Chip-List - 两个 mat-chip-list 声明共享相同的数据源

logging - Prestashop Logger::addLog() 在哪里保存日志文件?

Python无法导入tika

javascript - Google Chrome 控制台中的实例 init 意味着什么以及如何访问它?

javascript - 防止机器人提交到外部服务器

javascript - 如何从未加载的 wordpress 帖子中检索 img src 值?

Angular Material 销毁对话框实例

javascript - 复选框未选中状态

angular - 如何始终返回 index.html Tomcat

r - 将 UI 插入 R Shiny 模块服务器