有办法同时在 angular 库和根项目中使用 ngx-translate 吗？

Question

我有 angular 库，其中包含一个使用 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;

有办法同时在 angular 库和根项目中使用 ngx-translate 吗？

There is a way to use ngx-translate in angular library and in root project at the same time?

ngx-translate

angular

angular-library