介绍
@unifiedfactory/ngx-translate-gettext-loader 是一个 npm 包，用于将 gettext 语法翻译为 ngx-translate 可以理解的 json 格式。它是基于 webpack loader 的，因此可以与其他 webpack loader 一起使用。该包支持多种语言，并且能够很好地与 Angular 应用程序集成。
安装
要安装 @unifiedfactory/ngx-translate-gettext-loader，只需在终端中输入以下命令：
npm install @unifiedfactory/ngx-translate-gettext-loader --save-dev
配置
在 webpack.config.js 中添加 loader:
-
----- -------------
---- -
- ------- -----------------------------------------------
-------- -
------- -------
-------- ----
-
-
-
-这里的 test 正则表达式用于指定包含 gettext 词条的文件。在 options 对象中，我们指定了输出格式为 json，verbose 选项用于打印一些有用的信息。你也可以选择忽略此选项。
在 Angular 应用中添加 translate-loader：
要将 gettext 翻译成 ngx-translate 理解的 json，并且让 Angular 应用可以使用它，需要安装 ngx-translate-loader。可以通过以下命令来安装它：
npm install @ngx-translate/core --save
然后，只需在 app.module.ts 文件中添加以下代码来配置 ngx-translate：
------ - ----------- ---------------- - ---- -----------------------
------ - ---------------- --------------- - ---- ----------------------
------ - ------------------- - ---- -----------------------------
------ -------- ----------------------- ----------- -
------ --- --------------------------
-
-----------
-------- -
-----------------
-------------------------
------- -
-------- ----------------
----------- ------------------
----- ------------
-
--
--
--
------ ----- --------- - -现在，我们已经正确地配置了 ngx-translate 和 ngx-translate-gettext-loader。
使用
我们现在可以开始使用 ngx-translate-gettext-loader 了。假设我们有一个名为 messages.po 的 gettext 文件，内容如下：
----- ------ ------- ------ --------
我们可以在 Angular 应用中使用 ngx-translate 的 service，通过这种方式来翻译这个词条：
------ - ---------------- - ---- ----------------------
------------
--------- -----------
--------- ------- ------ ------- - --------- --------
--
------ ----- ------------ -
------------------- ----------------- ----------------- -
---------------------------
--------------------------- ----------------------------------- ------- -- -
---------------------------- -- ------- ------- -------
---
-
-总结
我们已经学习了如何使用 @unifiedfactory/ngx-translate-gettext-loader 来将 gettext 翻译为 ngx-translate 可以理解的 json。 我们还学习了如何在 Angular 应用程序中使用 ngx-translate 来显示翻译后的文本。
希望此教程对您有所帮助，谢谢阅读！
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/6005664581e8991b448e259a