Angular 5 и ngx-translate с общим модулем свободные переводы при обновлении

У меня есть приложение angular, которое использует ngx-translate. Ниже версии:

"@angular/core": "5.2.6",
"@ngx-translate/core": "9.1.1",
"@ngx-translate/http-loader": "2.0.1"

В классе AppModule я добавил импорт ниже:

imports: [
    .....
    TranslateModule.forRoot({
      loader: {
        provide: TranslateLoader,
        useFactory: (createTranslateLoader),
        deps: [HttpClient]
      }
    })
    ......
]
.....
export function createTranslateLoader(http: HttpClient) {
  return new TranslateHttpLoader(http, './assets/i18n/', '.json');
}

И я создал SharedModule, который экспортирует TranslateModule:

exports: [
    // Modules
    TranslateModule,
    ....
]

Все работает как шарм, за исключением тех случаев, когда я обновляю страницу, помещенную в другой модуль, чем модуль приложения (который импортирует SharedModule). В этом случае мне нужно вернуться на домашнюю страницу (закодированную в AppModule), как только я перейду на домашнюю страницу, ngx-translate вернусь к работе, и я могу повторно перейти на другие страницы с помощью ngx-translate, который работает.

Кто-нибудь может мне помочь? заранее спасибо

ОБНОВЛЕНИЕ Похоже, проблема связана с тем, что translateService.currentLang не определен, когда я обновляю страницу. Если я программно установил язык в ngOnInit через translateService.use (language), он работает. Как я могу избежать установки вручную в каждом компоненте этой проверки переменной currentLang, установив currentLang по умолчанию?


person user4330585    schedule 27.07.2018    source источник


Ответы (1)


У меня также был translateModule в моем общем модуле, и каждый модуль его импортировал. Я экспортировал TranslateModule в общий модуль. При этом все работало, как задумано, и для каждого модуля отображались его переводы. Может быть, попробуйте то же самое и посмотрите, сработает ли это для вас.

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

Установите useDefaultLanguage через translateService в загружаемом компоненте через app.module. Таким образом, это единственное место, где он устанавливает язык по умолчанию на верхнем уровне.

person Taranjit Kang    schedule 27.07.2018
comment
Я безуспешно пытался. если я обновляю страницу, я теряю перевод и все равно вижу ключевые слова вместо значений - person user4330585; 27.07.2018
comment
другие ваши модули импортируют общие модули? а вы ставили загрузчик translatemodule + функцию на путь в расшаренном модуле? - person Taranjit Kang; 27.07.2018
comment
Я поделился обновлением в основном вопросе. Вы что-нибудь об этом знаете? - person user4330585; 27.07.2018
comment
установите ngOnInit через translateService.use (language) в компоненте, который вы загружаете в свой app.module - это должно быть единственное место. - person Taranjit Kang; 27.07.2018
comment
Ты прав! Спасибо, Таранджит Канг, я дам тебе правильный ответ :) - person user4330585; 27.07.2018