Angular 18 本地化环境文件中的文本

Question

我正在使用 @angular/localize 来本地化我的角度应用程序。如何本地化不同环境文件（例如environment.ts、environment.development.ts、environment.qa.ts）中的文本？

用于产品

export const environment = {
  loginHelpText: $localize`Prod login message`,
};

对于开发者

export const environment = {
  loginHelpText: $localize`Dev login message`,
};

用于质量检查

export const environment = {
  loginHelpText: $localize`QA login message`,
};

运行时

ng extract-i18n --output-path src/locale --format json

它仅从environment.ts中提取文本。

Answer 1

这是预期的，i18n 仅为默认配置而提取。您应该做的是将 i18n 逻辑从环境文件中移出到您的应用程序中，然后向环境对象添加一个属性，以便可以识别它，例如

name

:

export const environment = {
  name: 'production',
};

在您的应用程序中，添加一个简单的 switch case / if else 来生成正确的消息：

import { environment } from 'path-to/environment';

export class YourComponent {
  loginHelpText = this.getLoginHelpText();

  private getLoginHelpText(): string {
    switch (environment.name) {
      case 'production':
        return $localize`Prod login message`;
      case 'qa':
        return $localize`QA login message`;
      case 'dev':
      default:
        return $localize`Dev login message`;
    }
  }
}