标签: angular-i18n

我正在尝试构建一个支持多种语言的应用程序——实际上多达 20 种。

默认语言是en-US. 在构建过程中，会创建可以正常工作的翻译版本。

但是，在所有构建中，LOCALE_ID始终是en-US. 所以我不能依赖管道等中的语言环境。它没有使用构建配置中设置的语言环境进行更新。

在编译每个语言环境时，我也收到此警告（此处为德语）：

找不到“de-DE”的语言环境数据。此语言环境将不包含任何语言环境数据。

这是构建配置在angular.json中的外观：

"production-de": {
  "fileReplacements": [
    {
      "replace": "src/environments/environment.ts",
      "with": "src/environments/environment.prod.ts"
    }
  ],
  "optimization": true,
  "outputHashing": "all",
  "sourceMap": false,
  "extractCss": true,
  "namedChunks": false,
  "aot": true,
  "extractLicenses": true,
  "vendorChunk": false,
  "buildOptimizer": true,
  "budgets": [
    {
      "type": "initial",
      "maximumWarning": "2mb",
      "maximumError": "5mb"
    },
    {
      "type": "anyComponentStyle",
      "maximumWarning": "6kb"
    }
  ],
  "outputPath": "dist/de",
  "baseHref": "/de/",
  "i18nLocale": "de-DE",
  "i18nFile": "src/locale/messages/messages.de.xlf",
  "i18nFormat": "xlf"
},

使用以下命令构建应用程序：

ng build …

我准备了具有本地化语言版本的应用程序。为此，我使用了原生的 Angular i18n 模块，该模块准备了两个应用程序包，每个包都有相应的语言。

应用程序的每个版本都可以在我的 nginx 服务器上的各个位置下使用：

• myapp.com/en/...
• myapp.com/pl/...

我希望我的应用程序作为 PWA安装一次，并使用（单个？）服务工作者提供两种语言版本。

不幸的是，我现在对@angular/pwa 模块所能做的就是为每个应用程序提供一个单独的服务工作者，这迫使我的应用程序的每个语言版本都单独安装。

我的问题是：应用程序有没有办法按照我使用@angular/pwa 或 Workbox描述的方式工作？

// 顺便说一下，Angular 的创建者没有强调@angular/localize 与@angular/pwa 的集成，这有点令人惊讶。

我们必须等到Angular 6 for angular-i18n才能支持错误消息代码的翻译等.

对于那些使用angular-i18n(例如,而不是ngx-translate)的人,你在做什么同时处理代码中的翻译？在我看来,如果没有很多字符串,那么一个简单的语言服务,通过语言代码和id来获得翻译的方法就可以了,但我对更优雅和"有棱角"的东西感兴趣.

我不知道承诺的代码翻译支持会是什么样子,但任何临时解决方案在上线时都可以很容易地转换为angular-i18n方式.

有什么人在处理这个问题？有任何想法吗？

我目前正在向我们公司使用的Angular应用添加语言环境。经过一番思考，我们决定采用Angular 5+本机i18n支持。

但是据我了解，每次生成翻译文件时都会创建ng xi18n --outputPath src/locale/ --locale en一个新文件。这意味着，每次添加新的i18n标记时，已经包含旧翻译的先前XLF文件都需要与新翻译合并。

这似乎很麻烦，因此我的问题是：是否有办法将新的反式单元仅附加到已经存在的XLF文件中？还是已经有一个工具可以将这两者合并在一起？

我正在尝试动态更改语言环境以更改i18n语言。我有两个文件，一个具有英语值，另一个具有法国值。

我现在尝试的是这样的：

 ngOnInit() {
    const localeName = localStorage.getItem('locale') || 'fr';
    import(`@angular/common/locales/${localeName}.js`).then(locale => {
      registerLocaleData(locale.default);
    });
  }

但是它给了我以下错误：

error TS1323: Dynamic import cannot be used when targeting ECMAScript 2015 modules.

关于如何动态地从英语切换到法语的任何想法？：/

我有角度 v9 的问题。我已经在我的应用程序中实现了 i18n 本地化功能。当我尝试在某个位置构建我的应用程序时，它会不断将子文件夹添加到基本 href 路径（但我想将文件保留在子文件夹中）。有什么方法可以防止将语言环境添加到基本 href url 中？

繁殖步骤：

1. 生成虚拟项目ng new Project。
2. 构建生产配置ng build --prod --localize。
3. 文件内置于dist/en-us/文件夹中，但index.html具有<base href="/en-US/">.

有没有办法强制 angular 停止将 langcode 添加到 base href 中？ 这会导致所有应用程序链接都包含不需要的语言代码。

我的部署配置为将基于目录的应用程序部署到不同的位置，每个位置都在 root 中。

• hxxp://app.fr//fr/文件夹中的根目录
• hxxp://app.de//de/文件夹中的根目录

由于 Angular 更新，我遇到了语言环境问题。

目前：

import localePl from '@angular/common/locales/pl';
registerLocaleData(localePl);

它正在工作，但会导致错误：

app.module.ts 中的警告取决于@angular/common/locales/pl。CommonJS 或 AMD 依赖项可能会导致优化救助。

它在哪里工作？

1. 我提供LOCALE_ID价值pl-PL
2. 并DatePipe在 HTML 中使用。(变量 | 日期) -variable等于new Date()

测试方法：

1)

import localePl from '@angular/common/locales/global/pl'; registerLocaleData(localePl, 'pl-PL');

错误：

'无法读取管道的未定义属性'0'

在代码中： variable | date

其中变量等于 new Date()

2） 如果我完全删除registerLocaleData

错误：

缺少语言环境“pl-PL”的语言环境数据。对于管道“DatePipe”

我正在使用 Angular 的本地化@angular/localize，在配置它以将应用程序翻译成不同的语言后，我尝试使用“ng serve”提供它的默认版本，但出现此错误：

An unhandled exception occurred: The development server only supports localizing a single locale per build.

我基于此尝试使用不同的端口：How to serve different Angular locales during development using ng serve?但无济于事。

对于翻译版本的一切作品用“NG服务--configuration = FR”。构建正常工作，在 dist/App 文件夹中创建“en-US”和“fr”文件夹。

当我在 dev-server 中删除 inlineLocales.size 条件时，一切正常，没有错误：

if (i18n.shouldInline && tsConfig.options.enableIvy !== false) {
    //if (i18n.inlineLocales.size > 1) {
    //    throw new Error('The development server only supports localizing a single locale per build');
    //}
    await setupLocalize(i18n, browserOptions, webpackConfig);
} …

我在项目文件夹中并在控制台中执行以下语句：

ng serve --configuration=de

执行因错误而中断：

ERROR in xliff parse errors: Message ... misses a translation

翻译是可用的。问题是什么？

您可以通过从我的存储库Bitbucket Repository 中检出应用程序来重现它并运行。

先感谢您。

我正在将 angular 7 应用程序迁移到 angular 9，它使用服务器端渲染（angular 通用）和 angular i18n 用于 2 种语言（法语和英语）。

在旧的 angular 7 流程中，由于我使用的是 AOT，因此我必须为生产进行 5 次构建：

• 2 x 客户端构建（1 个用于法语，1 个用于英语）
• 2 x 服务器构建（1 个用于法语，1 个用于英语）
• server.ts 的构建

然后，在server.ts我动态加载正确的服务器包

旧服务器.ts

app.engine('html', (_, options: any, callback) => {

  const isFR= options.req.url.indexOf('site-fr') >= 0 ;
  const {AppServerModuleNgFactory, LAZY_MODULE_MAP} = isFR ? require('./dist/server/fr/main') : require('./dist/server/en/main');

// Our index.html we'll use as our template
  const template = readFileSync(join(DIST_FOLDER, 'browser', isFR ? 'fr' : 'en', 'index.html')).toString();
  renderModuleFactory(AppServerModuleNgFactory, {
    // Our …