Получите перевод NGX для работы в библиотеке рабочего пространства NX - PullRequest
Новая
       42

Получите перевод NGX для работы в библиотеке рабочего пространства NX

5 голосов
/ 06 мая 2020

Я пытаюсь заставить переводы работать как для компонентов приложения, так и для компонентов библиотеки. На данный момент я могу заставить работать только компоненты приложения или библиотеки, но не одновременно.

Структура:

  • Создано приложение ioni c с домашним компонентом
  • Создал библиотеку "features / ui" с компонентом входа в систему
  • Создал библиотеку "core / localization" с компонентом перевода (у меня есть файлы перевода здесь и в angular. json Я копирую файлы в приложение)

Я могу заставить домашний компонент в приложении работать, если я добавлю import TranslateModule и provider в libs / features / ui / ui.module.ts: 

@NgModule({
  imports: [
    ReactiveFormsModule,
    FormsModule,
    CommonModule,
    ToastrModule.forRoot(),
    TranslateModule.forRoot({
      loader: {
        provide: TranslateLoader,
        useFactory: createTranslateLoader,
        deps: [HttpClient]
     }
})],
providers: [
  {
      provide: APP_INITIALIZER,
      useFactory: appInitializerFactory,
      deps: [TranslateService, Injector],
      multi: true
  }
],
declarations: [LoginComponent],
exports: [
  LoginComponent
]
})

Теперь переводы для входа в систему работают, но домашний компонент просто записывает ключ перевода «home.greet»

Я также могу заставить работать компонент входа в приложение, если я вместо этого добавьте тот же импортный TranslateModule и поставщик в libs / core / core.module.ts

Если я добавлю код в два разных места одновременно, логин будет переводиться только, но снова будет домашний компонент просто выписывает перевод k ey "home.greet"

Также кажется неправильным инициализировать его дважды, поэтому где мне разместить свой импорт и провайдера для переводов и как мне выполнить перевод в обоих местах?

1 Ответ

2 голосов
/ 11 мая 2020

Мне удалось решить то же самое, выполнив следующие шаги:

  1. Сохранение спецификаций библиотеки c переводов в lib-> feature-> sr c -> assets-> i18n folder.

  2. Обновление angular. json приложение-> архитектор-> сборка-> параметры-> активы с

    {"input": "libs / feature / src / assets / i18n "," glob ":" *. json "," output ":" assets / i18n / feature "}

  3. Обновить модуль перевода дляChild () в Lib-> feature.module 

TranslateModule.forChild({
          loader: {
            provide: TranslateLoader,
            useFactory: (http: HttpClient) => {
              return new TranslateHttpLoader(
                http,
                `${environment.i18nPrefix}/assets/i18n/feature/`,
                '.json'
              );
            },
            deps: [HttpClient]
          },
          isolate: true
        })
Включите следующий эффект в функциональном модуле 

 setTranslateServiceLanguage$ = createEffect(
    () =>
      this.store.pipe(
        select(selectSettingsLanguage),
        distinctUntilChanged(),
        tap(language => this.translateService.use(language))
      ),
    { dispatch: false }
  );

Благодаря репо ниже от tomastrajan https://github.com/tomastrajan/angular-ngrx-material-starter

...