在 Angular2 中，我们经常需要引入各种模块以便进行开发。然而，这些模块之间的引用关系往往会带来很多问题。比如，如果我们不按特定的顺序进行引用，就会导致编译错误，并给开发带来很多困难。
然而，Angular2 又提供了一种新的解决方案：不使用顺序进行模块引用。这种方案可以避免任何编译错误，并可大大提高开发效率。
如何不使用顺序进行模块引用
在新版 Angular2 中，我们可以使用 @NgModule 装饰器来定义应用程序的模块。使用此装饰器时，我们需要声明我们的模块所需的所有组件和服务。除此之外，我们还可以使用 import 来导入其他模块。这是 Angular2 不使用顺序的关键：我们可以在任何地方导入任何模块，而无需担心顺序。
以下是一个简单的示例代码：
-- -------------------- ---- -------
------ - ------------- - ---- ----------------------------
------ - -------- - ---- ----------------
------ - ------------ - ---- ------------------
-----------
------------- -
------------
--
-------- -
-------------
--
---------- ---
---------- --------------
--
------ ----- --------- - -如您所见，这里我们将 BrowserModule 导入到 App 模块中。而我们不需要考虑 BrowserModule 和 AppComponent 之间的顺序。
深入讨论
在 Angular2 中，模块之间的依赖并不仅仅是通过导入模块来实现的。实际上，Angular2 中的模块可以被视为面向对象编程中的“单例”，它们在应用程序中只有一个实例，并在运行时进行实例化。这种机制使得我们可以在不显式定义依赖的情况下使用模块，这也是 Angular2 不使用顺序的关键。
除此之外，我们还可以使用 lazy loading 来加载模块。所谓的“延迟加载”就是在需要时才加载模块。这种方法可以大大减小应用程序的大小，从而提高性能和速度。
如何使用 lazy loading
要使用 lazy loading，我们需要在路由中定义特定的路径。例如，以下代码演示了如何使用 lazy loading 模块：
-- -------------------- ---- -------
------ - -------- - ---- ----------------
------ - ------- ------------ - ---- ------------------
------ - ------------- - ---- ---------
----- ------- ------ - -
-
----- -------
---------- -------------
--
-
----- -------
------------- -----------------------------
-
--
-----------
-------- -------------------------------
-------- --------------
--
------ ----- ---------------- - -
在这里，我们将 HomeComponent 直接导入路由模块中，而将 LazyModule 设置为 “延迟加载”。LazyModule 将在用户访问 lazy 的子路由时才动态加载。
结论
因此，Angular2 中不使用顺序进行模块引用可以带来很多好处。我们可以轻松地引用其他模块，提高代码复用性和可读性。同时，使用 lazy loading 功能可以提高性能和加快页面加载速度。
参考资料
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67539ae38bd460d3ada642ab