2

我的应用程序基于JHipster,因此语言服务是通过库中的JhiLanguageService提供的,该ng-jhipster库使用JhiConfigService进行配置ngx-translate,而无需在我的app.module. 因此,当我添加TranslateModule.forRoot(...)到 AppModule 的导入时,一切都会中断,我只看到到处都是“找不到翻译……”的消息。

我不知道如何使我的延迟加载页面使用与应用程序的预先加载部分相同的翻译服务实例,以便更改导航栏的预先加载组件中的语言会影响延迟使用的语言-加载的页面。

我已经研究了这个想法这个想法,但他们都规定在 AppModule 中配置 TranslateModule 会破坏它,我不知道如何在 JHipster 应用程序中控制 ngx-translate 配置。

4

1 回答 1

1

通过将 BehaviorSubject 添加到 JhiLanguageHelper 服务,我设法修复了延迟加载模块中的翻译。

@Injectable()
export class JhiLanguageHelper {
    renderer: Renderer2 = null;
    private _language: BehaviorSubject<string>;

    constructor(
        private translateService: TranslateService,
        private rootRenderer: RendererFactory2,
        private findLanguageFromKeyPipe: FindLanguageFromKeyPipe,
        private titleService: Title,
        private router: Router
    ) {
        this._language = new BehaviorSubject<string>(this.translateService.currentLang);
        this.renderer = rootRenderer.createRenderer(document.querySelector('html'), null);
        this.init();
    }

    getAll(): Promise<any> {
        return Promise.resolve(LANGUAGES);
    }

    get language(): Observable<string> {
        return this._language.asObservable();
    }

    updateTitle(titleKey?: string) {
        if (!titleKey) {
             titleKey = this.getPageTitle(this.router.routerState.snapshot.root);
        }

        this.translateService.get(titleKey).subscribe((title) => {
            this.titleService.setTitle(title);
        });
    }

    private init() {
        this.translateService.onLangChange.subscribe((event: LangChangeEvent) => {
            this._language.next(this.translateService.currentLang);
            this.renderer.setAttribute(document.querySelector('html'), 'lang', this.translateService.currentLang);
            this.updateTitle();
            this.updatePageDirection();
        });
    }

    private getPageTitle(routeSnapshot: ActivatedRouteSnapshot) {
        let title: string = (routeSnapshot.data && routeSnapshot.data['pageTitle']) ? routeSnapshot.data['pageTitle'] : 'hcmGatewayApp';
        if (routeSnapshot.firstChild) {
            title = this.getPageTitle(routeSnapshot.firstChild) || title;
        }
        return title;
    }

    private updatePageDirection() {
        this.renderer.setAttribute(document.querySelector('html'), 'dir', this.findLanguageFromKeyPipe.isRTL(this.translateService.currentLang) ? 'rtl' : 'ltr');
    }
}

然后您像这样订阅模块中的 BehaviorSubject。

export class YourModule {
    constructor(private languageService: JhiLanguageService, private languageHelper: JhiLanguageHelper) {
        this.languageHelper.language.subscribe((languageKey: string) => this.languageService.changeLanguage(languageKey));
    }
}
于 2018-06-21T13:52:19.213 回答