[angular] 다국어 - Transrate

- app.module.ts

import { TranslateModule, TranslateLoader } from '@ngx-translate/core';
import { TranslateHttpLoader } from '@ngx-translate/http-loader';

export function createTranslateLoader(http: HttpClient) {
  return new TranslateHttpLoader(http, '../assets/i18n/', '.json');
}

TranslateModule.forRoot({
      loader: {
        provide: TranslateLoader,
        useFactory: (createTranslateLoader),
        deps: [HttpClient]
      }
    }),


- main.component.ts

import {TranslateService, LangChangeEvent} from '@ngx-translate/core';

public translateEntities: any = [];

constructor(public translate: TranslateService) {
    this.translate.get('appMain').subscribe((res: string) => {
      this.translateEntities = res;
    });

    this.translate.onLangChange.subscribe((event: LangChangeEvent) => {
      this.translateEntities = event.translations.appMain;
    });
}

component 에서 꺼낼때
this.translateEntities.app.maximum

html 에서 꺼낼때
{{ 'appMain.app.maximum' | translate }}


- top.ts

import {LangChangeEvent, TranslateService} from '@ngx-translate/core';

constructor(private translate: TranslateService) {
}

changeLangClick(lang: string) {
    this.translate.use(lang);
    this.common.useLang = lang;

    $("li[id^='lang_']").removeClass("cur");
    $("#lang_"+lang+"").addClass("cur");

    $.cookie("useLang", this.common.useLang);
  }