Angular
i1n SDKまたはngx-translateを使用したブリッジモードで、Angularにi1nを統合します。
セットアップ
Angularプロジェクトでi1n initを実行してください。CLIは、@ngx-translate/coreが存在する場合、それを自動検出し、JSON形式を設定します。
翻訳ファイルは locales/ ディレクトリに保存され、ngx-translate の HttpLoader と互換性があります。
スタンドアロンモード
i1nからinitとtをインポートし、Angularサービスやコンポーネントで直接使用してください。i1n SDKはngx-translateの軽量な代替として機能します。
依存性注入のためにAngularサービス経由でt()を提供するか、コンポーネントテンプレートで直接呼び出します。
ngx-translate を使用したブリッジモード
プロジェクトでngx-translateを使用している場合は、registerI1n((key, params) => translateService.instant(key, params))で接続してください。i1nのt()関数はngx-translateに委譲し、型安全なオートコンプリートを提供します。
i1nは翻訳ファイルと型生成を管理します。ngx-translateは引き続き実行時ロード、translateパイプ、TranslateServiceを処理します。既存のテンプレートは変更されません。
デプロイメント
ビルドステップにi1n pullを追加します。生成された翻訳ファイルは、ngx-translateの期待する形式と互換性があります。
大規模なアプリケーションでは、名前空間ファイルを使用して翻訳を機能モジュールごとに整理します。
src/app/app.component.ts
import { TranslateService } from '@ngx-translate/core';
@Component({
template: '<h1>{{ "welcome" | translate }}</h1>'
})
export class AppComponent {
constructor(private translate: TranslateService) {}
} Bridge Mode — app.module.ts
import { registerI1n } from 'i1n'
import { TranslateService } from '@ngx-translate/core'
// In your AppComponent constructor:
registerI1n((key, params) => this.translate.instant(key, params))