仅在满足条件时加载 Angular 2 模块

Question

在我的 Angular (v.4.1.1) 应用程序中，我使用拖放功能。基本上，标签之间的所有内容都可以通过拖放来移动。

动画和预览项目在 Chrome 和 Edge 等较新的浏览器中运行良好，但在 Internet Explorer 中，我会遇到大量峰值，这就是为什么我为其提供减少的动画和预览功能的原因。 我已经实现了两个版本的拖动 NgModule，它们包含具有相同接口但实现不同的组件和服务。但是，我不知道根据运行我的应用程序的浏览器有条件地导入它们的智能方法。

我创建了一个方法 isInternetExplorer()，我可以在模块装饰器的“导入”数组中使用它。此解决方案仅适用于常规 typescript 编译，不适用于 AOT 编译。有什么方法可以让我的解决方案在 AOT 环境中运行？

这里有一个简短的摘录来告诉你我的意思：

@NgModule({
   imports: [  
      isInternetExplorer() ? DragAndMockModule.forRoot() : DragModule.forRoot(), 
      ...
   ],
  ...
})

感谢您的帮助。

Answer 1

我认为您正在寻找的是以惰性方式加载模块。假设您的模块是自包含的，您可以利用路由器守卫（ROUTING & NAVIGATION）有条件地加载模块。 以下是有关如何实现此目的的分步教程：LAZY MODULE LOADING

希望对你有帮助。