<projectRoot>/i18n/
  ru.json
  en.json
  HOME/
    ru.json
    en.json
  HOME.COMMON/
    ru.json
    en.json
  ADMIN/
    ru.json
    en.json

export class MyTranslationLoader extends TranslateLoader implements OnDestroy {
  /** Глобальный кэш с флагами скачанных файлов переводов (чтобы не качать их повторно, для разных модулей) */
  private static TRANSLATES_LOADED: { [lang: string]: { [scope: string]: boolean } } = {};
  /** Сортируем ключи по возрастанию длины (маленькие куски будут вмердживаться в большие) */
  private sortedScopes = typeof this.scopes === 'string' ? [this.scopes] : this.scopes.slice().sort((a, b) => a.length - b.length);
  private getURL(lang: string scope: string): string {
    // эта строка будет зависеть от того, куда и как вы кладете файлы переводов
    // в нашем случае они лежат в корне проекта в директории i18n
    return `i18n/${scope ? scope + '/' : ''}${lang}.json`;
  }
  /** Скачиваем переводы и запоминаем, что мы их скачали */
  private loadScope(lang: string, scope: string): Observable<object> {
    return this.httpClient.get(this.getURL(lang, scope)).pipe(
      tap(() => {
        if (!MyTranslationLoader.TRANSLATES_LOADED[lang]) {
          MyTranslationLoader.TRANSLATES_LOADED[lang] = {};
        }
        MyTranslationLoader.TRANSLATES_LOADED[lang][scope] = true;
      })
    );
  }
  /**
   * Все скачанные переводы необходимо объединить в один объект
   * т.к. мы знаем, что файлы переводов не имеют пересечений по ключам,
   * можно вместо сложной логики глубокого мерджа просто наложить объекты друг на друга,
   * но надо делать это в правильном порядке, именно для этого мы выше отсортировали наши scope по длине,
   * чтобы наложить HOME.COMMON на HOME, а не наоборот
   */
  private merge(scope: string, source: object, target: object): object {
    // обрабатываем пустую строку для root модуля
    if (!scope) {
      return { ...target };
    }
    const parts = scope.split('.');
    const scopeKey = parts.pop();
    const result = { ...source };
    // рекурсивно получаем ссылку на объект, в который необходимо добавить часть переводов
    const sourceObj = parts.reduce(
      (acc, key) => (acc[key] = typeof acc[key] === 'object' ? { ...acc[key] } : {}),
      result
    );
        // также рекурсивно достаем нужную часть переводов и присваиваем
    sourceObj[scopeKey] = parts.reduce((res, key) => res[key] || {}, target)?.[scopeKey] || {};
    return result;
  }
  constructor(private httpClient: HttpClient, private scopes: string | string[]) {
    super();
  }
  ngOnDestroy(): void {
    // сбрасываем кэш, чтобы при hot reaload переводы перекачались
    MyTranslationLoader.TRANSLATES_LOADED = {};
  }
  getTranslation(lang: string): Observable<object> {
    // берем только еще не скачанные scope
    const loadScopes = this.sortedScopes.filter(s => !MyTranslationLoader.TRANSLATES_LOADED?.[lang]?.[s]);
    if (!loadScopes.length) {
      return of({});
    }
    // скачиваем все и сливаем в один объект
    return zip(...loadScopes.map(s => this.loadScope(lang, s))).pipe(
      map(translates => translates.reduce((acc, t, i) => this.merge(loadScopes[i], acc, t), {}))
    );
  }
}

export declare abstract class MissingTranslationHandler {
  /**
   * A function that handles missing translations.
   *
   * @param params context for resolving a missing translation
   * @returns a value or an observable
   * If it returns a value, then this value is used.
   * If it return an observable, the value returned by this observable will be used (except if the method was "instant").
   * If it doesn't return then the key will be used as a value
   */
  abstract handle(params: MissingTranslationHandlerParams): any;
}

export class MyMissingTranslationHandler extends MissingTranslationHandler {
  // кэшируем Observable с переводом, т.к. при входе на страницу, для которой еще нет переводов,
  // каждая translate pipe вызовет метод handle
  private translatesLoading: { [lang: string]: Observable<object> } = {};
  handle(params: MissingTranslationHandlerParams) {
    const service = params.translateService;
    const lang = service.currentLang || service.defaultLang;
    if (!this.translatesLoading[lang]) {
      // вызываем загрузку переводов через loader (тот самый, который реализован выше)
      this.translatesLoading[lang] = service.currentLoader.getTranslation(lang).pipe(
        // добавляем переводы в общее хранилище ngx-translate
        // флаг true говорит о том, что объекты необходимо смерджить
        tap(t => service.setTranslation(lang, t, true)),
        map(() => service.translations[lang]),
        shareReplay(1),
        take(1)
      );
    }
    return this.translatesLoading[lang].pipe(
      // вытаскиваем необходимый перевод по ключу и вставляем в него параметры
      map(t => service.parser.interpolate(service.parser.getValue(t, params.key), params.interpolateParams)),
      // при ошибке эмулируем стандартное поведение, когда нет перевода — возвращаем ключ
      catchError(() => of(params.key))
    );
  }
}

export function loaderFactory(scopes: string | string[]): (http: HttpClient) => TranslateLoader {
  return (http: HttpClient) => new MyTranslationLoader(http, scopes);
}
// ...
// app.module.ts
TranslateModule.forRoot({
  useDefaultLang: false,
  loader: {
    provide: TranslateLoader,
    useFactory: loaderFactory(''),
    deps: [HttpClient],
  },
})
// home.module.ts
TranslateModule.forChild({
  useDefaultLang: false,
  extend: true,
  loader: {
    provide: TranslateLoader,
    useFactory: loaderFactory(['HOME', 'HOME.COMMON']),
    deps: [HttpClient],
  },
  missingTranslationHandler: {
    provide: MissingTranslationHandler,
    useClass: MyMissingTranslationHandler,
  },
})
// admin.module.ts
TranslateModule.forChild({
  useDefaultLang: false,
  extend: true,
  loader: {
    provide: TranslateLoader,
    useFactory: loaderFactory(['ADMIN', 'HOME.COMMON']),
    deps: [HttpClient],
  },
  missingTranslationHandler: {/*...*/},
})

export function translateConfig(scopes: string | string[]): TranslateModuleConfig {
  return {
    useDefaultLang: false,
    loader: {
      provide: TranslateLoader,
      useFactory: httpLoaderFactory(scopes),
      deps: [HttpClient],
    },
  };
}
@NgModule()
export class MyTranslateModule {
  static forRoot(scopes: string | string[] = [], config?: TranslateModuleConfig): ModuleWithProviders<TranslateModule> {
    return TranslateModule.forRoot({
      ...translateConfig([''].concat(scopes)),
      ...config,
    });
  }
  static forChild(scopes: string | string[], config?: TranslateModuleConfig): ModuleWithProviders<TranslateModule> {
    return TranslateModule.forChild({
      ...translateConfig(scopes),
      extend: true,
      missingTranslationHandler: {
        provide: MissingTranslationHandler,
        useClass: MyMissingTranslationHandler,
      },
      ...config,
    });
  }
}