0

我有一个旧的 Angular 项目 (v8)，我使用 i18n 来标记我所有的翻译。我有 2 个 xlf 文件，一个用于 en，一个用于 fr - 并在运行时选择要使用的文件。这工作正常。

但是，在一个新的 Angular 项目 (v11) 中，这种方法不再有效。该代码没有错误，并且确实表明存在问题，但是文本未在屏幕上进行翻译。

main.ts文件中的代码如下

let languageCode: string = localStorage.getItem("language") ? localStorage.getItem("language") : 'en-GB';

// use the require method provided by webpack
// we use the webpack raw-loader to return the content as a string
declare const require;

var translations = undefined;

switch (languageCode) {
    case AppService.Languages.english:
        break;
  default:
        translations = require(`raw-loader!./locale/messages.${languageCode}.xlf`);
  break;
}
 
platformBrowserDynamic().bootstrapModule(AppModule, {
  providers: [
    {provide: TRANSLATIONS, useValue: translations},
    {provide: TRANSLATIONS_FORMAT, useValue: 'xlf'},
    {provide: LOCALE_ID, useValue: languageCode }
  ]
});

我在 app.module.ts 中也有以下内容

import { registerLocaleData } from '@angular/common';
import localeFr from '@angular/common/locales/fr';
import localeFrExtra from '@angular/common/locales/extra/fr';

let urlParams: URLSearchParams = new URLSearchParams(window.location.search);
let languageCode: string = localStorage.getItem("language") ? localStorage.getItem("language") : 'en-GB';

registerLocaleData(localeFr, 'fr-FR', localeFrExtra);

.....

 providers: [
    { provide: LOCALE_ID, useValue: languageCode },

有没有其他人有过这种方法在较新的角度版本中不起作用的经验？

注意：诸如日期格式之类的内置内容在正确的语言环境中出现 - EG 日期格式 01 décembre 20。它纯粹是 i18n 的替换，尚未完成。

4

1 回答 1

0

我确实添加了额外的代码，但是我现在意识到如果你使用 ivy - (tsconfig.json - angularCompilerOptions - "enableIvy": false) 那么它在运行时显然不能与上述代码一起使用。

我已经阅读了关于他们为 i18n 所做的更改的常春藤文档，我可以看到他们只是不打算在运行时更改翻译。

我已经关闭了常春藤，旧代码现在可以工作了。

我可以看到他们的推理，但我不能为每种语言设置不同的 url，所以这是我唯一的选择。

于 2020-12-03T10:54:37.147 回答