ngx-feda-translate

Traducciones por scope (módulo) con JSON anidado e interpolación de parámetros. Compatible con Angular 18 y Signals.

Instalación

npm i ngx-feda-translate

Requiere que tus archivos estén en assets/i18n/<scope>/<lang>.json (por defecto lang = es). Puedes cambiar la base y el idioma por defecto sobreescribiendo TRANSLATION_CONSTANTS en tu app si compilas desde fuente.

Uso rápido

1. Archivos de traducción

assets/
└── i18n/
    ├── global/
    │   └── es.json
    └── home/
        └── es.json

assets/i18n/global/es.json

{ "welcome": "Hola {{user}}", "nested": { "role": "Tu rol es {{role}}" } }

2. Resolver para precargar

// en tu ruta
{
  path: '',
  resolve: { t: TranslationResolver },
  data: { translationModule: ['global', 'home'] },
  loadComponent: () => import('./home.component').then(m => m.HomeComponent)
}

3. Pipe y/o directiva de scope

<!-- pipe directo -->
<h1>{{ 'welcome' | t:{ user: 'Eric' }:'global' }}</h1>

<!-- con scope contextual -->
<div appScope="home">
  {{ 'nested.role' | t:{ role: 'Admin' } }}
</div>

API

• TranslationService.setTranslationsFile(scope: string) carga el JSON del scope.
• TranslationService.get(key, scope) obtiene la clave.
• TranslationService.translateWithParams(key, scope, params) obtiene e interpola.
• TranslationResolver permite precargar scopes desde el router.
• TranslatePipe (t) para plantillas.
• TranslationScopeDirective (appScope) para definir/propagar el scope actual.

Estructura y extensiones

• TRANSLATION_CONSTANTS: BASE_PATH = assets/i18n, DEFAULT_LANGUAGE = es, SCOPE_SEPARATOR = '.'.
• Puedes guardar en caché (localStorage) envolviendo TranslationLoaderService.
• Para multi-idioma, expón un servicio que cambie DEFAULT_LANGUAGE o genere rutas por idioma.