Angular i18n
Angular i18n 解决方案
为 Angular 应用程序提供独立组件、Signals 和 SSR 支持。
Get started in 3 steps
1
Install
Add the Better i18n Angular package to your project.
terminal
npm install @better-i18n/angular
2
Import the module
Import BetterI18nModule in your AppModule or standalone component.
app.module.ts
import { BetterI18nModule } from '@better-i18n/angular';
@NgModule({
imports: [
BetterI18nModule.forRoot({
project: 'your-org/your-project',
defaultLocale: 'en',
}),
],
})
export class AppModule {}3
Use the translate pipe
Use the translate pipe or directive in your templates to display translations.
app.component.html
<h1>{{ 'welcome' | translate }}</h1>
<p>{{ 'greeting' | translate: { name: userName } }}</p>功能
独立组件支持
翻译管道
i18n 指令
可注入服务
延迟加载模块
AOT 编译支持
Angular Universal SSR
Signals 支持
Angular CLI 集成
快速开始
使用管道和服务将 i18n 添加到您的 Angular 应用程序中。
// app.component.ts
import { Component } from '@angular/core';
import { TranslateService } from '@better-i18n/angular';
@Component({
selector: 'app-root',
template: `
<h1>{{ 'welcome' | translate }}</h1>
<p>{{ 'greeting' | translate: { name: 'World' } }}</p>
`
})
export class AppComponent {
constructor(private translate: TranslateService) {
translate.setDefaultLang('en');
}
}兼容热门 Angular i18n 库
Better i18n 补充你的 Angular i18n 库 — 可视化管理翻译、与翻译人员协作，并通过 CDN 部署。
Better i18n + @ngx-translate/core
使用最广泛的 Angular 翻译库。通过管道、指令和服务注入实现运行时翻译。
Better i18n 导出为 ngx-translate JSON 格式。在仪表板中编辑翻译，自动同步到你的仓库。
Better i18n + Angular i18n (built-in)
Angular 官方 i18n 系统，支持 AOT 编译、ICU 表达式和构建时翻译提取。
导出为 Angular XLIFF 格式。Better i18n 管理翻译工作流，Angular CLI 构建特定语言环境的包。
Better i18n + Transloco
现代、轻量级的 Angular i18n 库，支持延迟加载、丰富的插件和出色的 TypeScript 支持。
通过 Better i18n 的 GitHub 集成将翻译同步到 Transloco JSON 格式。通过 CDN 分发实时更新。