简介
NGX-Routable 是一个前端路由管理器，用于实现 Web 应用程序的完整客户端路由系统。它使用 Angular 的路由器，并提供了更好的配置和控制。
安装
要开始使用 NGX-Routable，您需要先安装它。您可以在终端中使用以下命令进行安装：
--- ------- ------------
如何使用
我们可以通过以下步骤使用 NGX-Routable：
- 首先，我们需要在我们的模块中添加 RoutableModule 。
------ - -------- - ---- ----------------
------ - -------------- - ---- ---------------
-----------
-------- -
------------------------
------- -
- ----- -------- ---------- ------------- --
- ----- --------- ---------- -------------- -
-
--
-
--
------ ----- --------- - -- 添加 到我们的组件中。
-------------------------------
NGX-Routable 的指令和类
RoutableModule
RoutableModule 是一个用于包含路由器配置和将其注入模块的类。它具有一个名为 forRoot 的静态方法，用于接收路由配置。
------ - -------- - ---- ----------------
------ - -------------- - ---- ---------------
-----------
-------- -
------------------------
------- -
- ----- -------- ---------- ------------- --
- ----- --------- ---------- -------------- -
-
--
-
--
------ ----- --------- - -RoutableService
RoutableService 是一个包含 NGX-Routable 将使用的公共服务的类。
------ - ---------- - ---- ----------------
------ - --------------- - ---- ---------------
-------------
------ ----- ----------- ------- --------------- -
------ ---------- -
-- ---
-
-RoutableComponent
RoutableComponent 是一个以 programme 方式控制路由的基本类。
------ - --------- - ---- ----------------
------ - ----------------- - ---- ---------------
------------
--------- -
---- ---------------
--- ----------------- ------------ -------
------- ------------------ --------
------
-
--
------ ----- --------------- ------- ----------------- -
------ ------- ----
------ ---------------------- ---- -
----------- - -----------------------------
-
------- ------------- ------- -
-- ---
-
-RoutableOutletDirective
RoutableOutletDirective 是一个指令，指定路由组件要显示的区域。
-------------------------------
NGX-Routable 的 API
RoutableService
getRoutes()
getRoutes() 方法返回当前路由，以及路由参数、查询等。您可以使用该方法在组件或服务中获取当前路由。
------ - ---------- - ---- ----------------
------ - --------------- - ---- ---------------
-------------
------ ----- ----------- ------- --------------- -
------ ---------- -
----- - ------ - - -----------------
-- ---
-
-RoutableComponent
go()
go() 方法根据指定的路由参数进行导航。
------ - --------- - ---- ----------------
------ - ----------------- - ---- ---------------
------------
--------- -
------- -------------------------------------- -- ---------------
-
--
------ ----- ------------------- ------- ----------------- -
------ ------------------- -
------------------ - --- - ---
-
-结论
NGX-Routable 是一个非常有用的前端路由管理器，它可以为您的 Web 应用程序提供完整的客户端路由系统。使用该库需要一些学习和实践，但您掌握了 NGX-Routable 后，就可以为您的 Web 应用程序添加更好的配置和控制，提升用户体验。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/60055b7a81e8991b448d8fe5