有一种方法可以同时在角度库和根项目中使用ngx-translate？

Question

我有一个角度库，其组件使用ngx-translate进行翻译：

@NgModule({
    imports: [
       TranslateModule.forRoot({
            loader: {
              provide: TranslateLoader,
              useClass: WebpackTranslateLoader,
              deps: [HttpClient],
            },
            isolate: true
          }),
    ],
    ...
})
export class LibraryModule {
    ...
}

如果我在一个简单的项目中使用此库，它将按预期工作。但是，如果我在具有自己的ngx-translate配置的项目中使用它：

@NgModule({
  imports: [
    TranslateModule.forRoot({
      loader: {
        provide: TranslateLoader,
        useClass: WebpackTranslateLoader,
        deps: [HttpClient],


       },
        }),
      ],
...

然后项目翻译无效。翻译来自共享库。如果我不使用该库，它将按预期工作。

我尝试在库模块中使用TranslateModule.forChild并获得此错误：AppComponent.html：1错误NullInjectorError：StaticInjectorError（AppModule）[TranslateService-> TranslateStore]：

我使用：

"@angular/core": "^9.1.4",
"@ngx-translate/core": "^12.1.2",
"@ngx-translate/http-loader": "^4.0.0",

Answer 1

组件根构造函数中的强制分配解决了此问题。

this._translateService.currentLoader = new WebpackTranslateLoader();

但是子库翻译丢失了。通过手动合并翻译解决了这个问题：

getTranslation(lang: string): Observable<any> {
    const result = forkJoin(
      [
        from(<rootTranslation>),
        new ChildLibraryTranslateLoader().getTranslation(lang)]
      ).pipe(map(translations => {
        return { ...translations[0], ...translations[1] };
    }));

    return result;