Documentación Angular

Angular

Integra i1n con Angular usando el SDK de i1n o el Modo Puente con ngx-translate.

Configuración

Ejecute i1n init en su proyecto Angular. La CLI detecta automáticamente @ngx-translate/core si está presente y configura el formato JSON.

Los archivos de traducción se almacenan en el directorio locales/, compatibles con HttpLoader de ngx-translate.

Modo Independiente

Importa init y t de i1n y úsalos directamente en tus servicios y componentes de Angular. El SDK de i1n funciona como una alternativa liviana a ngx-translate.

Proporcione t() a través de un servicio de Angular para la inyección de dependencias, o llámelo directamente en las plantillas de componentes.

Modo Puente con ngx-translate

Si tu proyecto usa ngx-translate, conéctalo con: registerI1n((key, params) => translateService.instant(key, params)). La función i1n t() delega a ngx-translate mientras proporciona autocompletado seguro de tipos.

i1n administra los archivos de traducción y la generación de tipos. ngx-translate continúa manejando la carga en tiempo de ejecución, la tubería de traducción (translate pipe) y el TranslateService. Sus plantillas existentes permanecen sin cambios.

Despliegue

Agrega i1n pull a tu paso de compilación. Los archivos de traducción generados son compatibles con el formato esperado de ngx-translate.

Para aplicaciones grandes, organiza las traducciones por módulo de funcionalidad utilizando archivos de espacio de nombres.

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))

Relacionado