Biblioteca angular personalizada con ngx-translate

Solución:

Como no estaba llegando a ninguna parte, probé otro enfoque como se describe en esta publicación. Así que convertí mis archivos json en archivos ts que devuelven un objeto json. Luego creé mi propio translateService que agrega las traducciones sobre las existentes (las agregadas por los archivos json de la aplicación principal) como se describe en la publicación.

Esto funcionó, pero anuló las traducciones anteriores o incluso se cargó demasiado tarde. Esto dio como resultado que la aplicación solo mostrara las claves de traducción en lugar de la traducción. Entonces, en lugar de inicializar las traducciones como en la publicación, usé una suscripción para esperar primero las traducciones principales.

//Library
import { Injectable } from '@angular/core';
import { TranslateService } from '@ngx-translate/core';
import { en } from "../localization/en";
import { nl } from "../localization/nl";

@Injectable()
export class TranslateUiService {
    private availableLanguages = { en, nl };

    constructor(private translateService: TranslateService) {
    }

    public init(language: string = null): any {
        if (language) {
            //initialize one specific language
            this.translateService.setTranslation(language, this.availableLanguages[language], true);
        } else {
            //initialize all
            Object.keys(this.availableLanguages).forEach((language) => {
                this.translateService.setTranslation(language, this.availableLanguages[language], true);
            });
        }
    }
}

//App
constructor(private translateUiService: TranslateUiService, private translateService: TranslateService) {
        this.translateService.setDefaultLang('en');
        this.translateService.use('en').subscribe(() => {
            this.translateUiService.init('en');
        });
    }

---

---

Utiliza Nuestro Buscador