以下是一个简单的步骤，演示如何在Angular应用程序中使用i18n进行模板翻译：
1. 安装 Angular 的 i18n 包:
ng add @angular/localize
2. 标记需要翻译的文本:
在你的模板中，使用 i18n 属性来标记需要翻译的文本。
<p i18n="@@myMessage">This is a message to be translated.</p>
3. 提取翻译字符串:
运行以下命令来提取需要翻译的字符串：
ng extract-i18n
这将在 src/locale 目录下生成一个 messages.xlf 文件，其中包含需要翻译的文本。
4. 翻译:
打开 messages.xlf 文件，将其中的文本翻译成目标语言。你可以使用翻译工具或手动编辑这个文件。
5. 编译翻译文件:
运行以下命令来编译翻译文件：
ng xi18n
这将生成一个翻译后的文件，通常是 messages.xx.xlf（xx 代表目标语言代码）。
6. 在应用中使用翻译文件:
在 app.module.ts 中配置翻译文件：
import { registerLocaleData } from '@angular/common';
import localeZh from '@angular/common/locales/zh';
registerLocaleData(localeZh);
@NgModule({
...
providers: [
{ provide: LOCALE_ID, useValue: 'zh' },
...
],
...
})
确保在应用程序中加载正确的翻译文件。
7. 在模板中使用翻译:
在模板中使用翻译后的文本：
<p i18n="@@myMessage">这是要翻译的消息。</p>
Angular 将根据当前的语言环境显示相应的文本。
请确保在整个过程中保持文件结构的一致性，并根据需要更新 Angular 版本。这是一个简单的指南，具体步骤可能会因你的应用结构和需求而有所不同。
转载请注明出处：http://www.pingtaimeng.com/article/detail/4969/Angular