Angular
Intégrez i1n avec Angular en utilisant le SDK i1n ou le mode Bridge avec ngx-translate.
Configuration
Exécutez i1n init dans votre projet Angular. Le CLI détecte automatiquement @ngx-translate/core s'il est présent et configure le format JSON.
Les fichiers de traduction sont stockés dans le répertoire locales/, compatibles avec HttpLoader de ngx-translate.
Mode autonome
Importez init et t depuis i1n et utilisez-les directement dans vos services et composants Angular. Le SDK i1n fonctionne comme une alternative légère à ngx-translate.
Fournissez t() via un service Angular pour l'injection de dépendances, ou appelez-le directement dans les modèles de composants.
Mode pont avec ngx-translate
Si votre projet utilise ngx-translate, connectez-le avec : registerI1n((key, params) => translateService.instant(key, params)). La fonction i1n t() délègue à ngx-translate tout en offrant une complétion automatique type-safe.
i1n gère les fichiers de traduction et la génération de types. ngx-translate continue de gérer le chargement à l'exécution, le pipe translate et le TranslateService. Vos modèles existants restent inchangés.
Déploiement
Ajoutez i1n pull à votre étape de build. Les fichiers de traduction générés sont compatibles avec le format attendu par ngx-translate.
Pour les grandes applications, organisez les traductions par module de fonctionnalité en utilisant des fichiers d'espace de noms.
import { TranslateService } from '@ngx-translate/core';
@Component({
template: '<h1>{{ "welcome" | translate }}</h1>'
})
export class AppComponent {
constructor(private translate: TranslateService) {}
} import { registerI1n } from 'i1n'
import { TranslateService } from '@ngx-translate/core'
// In your AppComponent constructor:
registerI1n((key, params) => this.translate.instant(key, params))