对于一个单页面应用程序（Single-Page Application），路由信息是非常重要的。在 Angular2 中，我们可以使用 Router 类和 ActivatedRoute 类获取当前路由信息。本文将向您介绍如何在 Angular2 中获取当前路由信息。
获取当前路由信息的方法
Router 类
在 Angular2 中，您可以使用 Router 类获取当前路由信息。代码如下：
-- -------------------- ---- -------
------ - ------ - ---- ------------------
------------------- ------- ------- --
---------- -
-- ------
----------------------------- -- -
-------------------- - -----
---
-上述代码中，我们使用了 router.url 属性来订阅路由变化事件。当路由发生变化时，回调函数内部的代码块就会被执行，打印出当前路由信息。
ActivatedRoute 类
除了 Router 类之外，我们还可以使用 ActivatedRoute 类获取当前路由信息。代码如下：
-- -------------------- ---- -------
------ - -------------- - ---- ------------------
------------------- ------ --------------- --
---------- -
-- ------
---------------------------- -- -
-------------------- - -----
---
-上述代码中，我们通过订阅 route.url 属性来获取当前路由信息。与 Router 类相比，该方法需要注入 ActivatedRoute 类来实现。
示例代码
以下是一个完整的示例代码，用于演示如何获取当前路由信息：
-- -------------------- ---- -------
------ - ---------- ------ - ---- ----------------
------ - ------- -------------- - ---- ------------------
------------
--------- -----------
--------- -
------------ ------------ -------
-
--
------ ----- ------------ ---------- ------ -
------------- -------
------------
------- ------- -------
------- ------ --------------
- --
---------- -
-- -- ------ ---------
----------------------------- -- -
----------------- - --------------
---
-- -- -------------- ---------
---------------------------- -- -
----------------- - --------------
---
-
-在上述代码中，我们使用了 Router 类和 ActivatedRoute 类来获取当前路由信息，并将这些信息输出到模板中。
结论
在本文中，我们介绍了如何在 Angular2 中获取当前路由信息。通过使用 Router 类和 ActivatedRoute 类，我们可以很容易地获取当前路由信息，并对其进行处理。本文的示例代码可以帮助您更好地理解这个过程，并提供了实现此功能的最佳实践。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6728f6e22e7021665e223a5e