Angular i18n 拆分翻译文件答案

【问题标题】：Angular i18n splitting translation filesAngular i18n 拆分翻译文件
【发布时间】：2018-06-18 06:44:19
【问题描述】：

我开始使用 i18n 方法翻译我的 Angular 应用程序，
由于翻译文件真的很长，而且不可读，而且我将来可能需要返回并更新它，所以我想拆分它，例如：

assets/
└── i18n/
   ├── users/
   │   ├── en.json
   │   └── fr.json
   └── products/
       ├── en.json
       └── fr.json

拆分不是针对每个组件，而是针对应用的上下文。
如何实现这种拆分？

【问题讨论】：

标签： xml angular internationalization

【解决方案1】：

在您的情况下，我假设它是模块，您所要做的就是创建与模块（上下文）一样多的文件夹，在巫婆中，您将存储您的语言 files.json，然后调整您app.modules 如下：

TranslateModule.forChild({
              loader: {
                provide: TranslateLoader,
                useFactory: (createTranslateLoader),
                deps: [HttpClient]
            },
            isolate: true
        }),

p.s ：“隔离”对于能够重新实例化您的翻译模块很重要。

使用“createTranslateLoader”从正确的文件夹加载翻译文件的功能如下（以用户为例）：

export function createTranslateLoader(http: HttpClient) {
  return new TranslateHttpLoader(http, './assets/i18n/users/', '.json');
}

你去吧:)

【讨论】：

【解决方案2】：

您可以使用Angular i18n Merge Files，前提是您更改文件名以符合此工具使用的模式。

重命名/assets 文件夹中的文件，使其文件名与*.messages.*.json 模式匹配：

assets/
└── i18n/
   ├── users/
   │   ├── users.messages.en.json
   │   └── users.messages.fr.json
   └── products/
       ├── products.messages.en.json
       └── products.messages.fr.json

运行：

npx ng-i18n-merge-files -f json -o ./assets/i18n

它会生成以下包含合并内容的文件：

assets/
└── i18n/
   ├── messages.en.json
   └── messages.fr.json

【讨论】：