随着互联网技术的不断发展，跨国企业和项目组也越来越多地涉及到国际化问题。而在前端开发中，国际化主要涉及到对多语言管理和服务端路由支持。@ngx-i18n-router/config-loader 就是一个帮助你解决这些问题的 npm 包。
什么是 @ngx-i18n-router/config-loader
@ngx-i18n-router/config-loader 是一个为 Angular 应用提供多语言管理和服务端路由支持的 npm 包。它可以帮助你快速地加载 JSON 格式的本地化资源，并将其应用到应用程序中的 URL 上。
如何安装和使用
安装
你可以通过以下命令来安装 @ngx-i18n-router/config-loader：
npm install @ngx-i18n-router/config-loader --save
使用
安装完成之后，你需要在应用程序的根模块（AppModule）中引入 ConfigLoaderService：
-- -------------------- ---- -------
------ - -------- - ---- ----------------
------ - ------------- - ---- ----------------------------
------ - ------------------- - ---- ---------------------------------
------ - ------------ - ---- ------------------
-----------
-------- -
--------------
--
------------- -
-------------
--
---------- -
--------------------
--
---------- --------------
--
------ ----- --------- - -在引入 ConfigLoaderService 之后，你可以在应用程序中使用 ConfigLoaderService 来加载本地化资源。
以下是一个简单的示例代码：
-- -------------------- ---- -------
------ - --------- - ---- ----------------
------ - ------------------- - ---- ---------------------------------
------------
--------- -----------
--------- -
------- ------------- - --------- --------
-
--
------ ----- ------------ -
------------------- ------------- -------------------- -
------------------
-
------------- ---- -
--------------------------------------------------------------------- ---- -- -
------------------
---
-
-这段代码通过 ConfigLoaderService 的 load 方法加载了指定路径下的本地化资源文件。{{LANG}} 是这个字符串的占位符，用来表示语言的缩写。例如，如果你要加载中文的本地化资源文件，则路径应该为 /assets/i18n/zh.json。
当本地化资源文件加载成功后，会触发一个 Observable 流。你可以在这个流中获取到本地化资源的数据，并将其应用到你的应用程序中。
配置路由
如果你需要支持服务端路由，则需要在应用程序的路由配置中将 ConfigLoaderService 注入到 resolve 函数中，来加载本地化资源文件。
以下是一个示例代码：
-- -------------------- ---- -------
------ - -------- - ---- ----------------
------ - ------- ------------ - ---- ------------------
------ - ------------------- - ---- ---------------------------------
----- ------- ------ - -
-
----- ---
---------- -------
----------- -------
--
-
----- -------
-------- -
----- -------------------
--
------------- -- -- ----------------------------------- -- -------------
-
--
-----------
-------- -------------------------------
-------- --------------
--
------ ----- ---------------- - -这段代码将 ConfigLoaderService 注入到了路由的 resolve 函数中，当路由被触发时，会在服务端加载本地化资源，并将其应用到 URL 中。
总结
@ngx-i18n-router/config-loader 可以帮助你在 Angular 应用中快速地加载多语言资源，并将其应用到 URL 中。它的原理很简单，但是在实际应用中却可以解决非常复杂繁琐的国际化问题。希望这篇文章能够帮助你更好地理解 @ngx-i18n-router/config-loader 并在实际应用中得到运用。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60056ed481e8991b448e77ec