Question

我在Shared模块中有一个组件，其中的文本必须使用NGX-TRANSLATE进行本地化。但是我认为共享模块中的组件没有获取到app.module.ts中加载的JSON文件，并且出现了以下错误。 “无法读取未定义的属性'Desc'”。我还注意到，转换管道和TranslateService在shared.component.ts中工作。让我知道我是否缺少某些依赖项。

https://stackblitz.com/edit/angular-lmawme

app.module.ts

export function createTranslateLoader(http: HttpClient) {
  return new TranslateHttpLoader(http, './assets/i18n/', '.json');
}

app.component.ts

  constructor(private translate: TranslateService){
    translate.addLangs(['en','fr']);
    translate.setDefaultLang('fr');
    translate.use('fr');
    console.log(translate.getLangs());
  } 

shared.component.ts(template)
<div>Shared Component :  {{Shared.Desc|translate}}</div>

Answer 1

只需将模板更改为<div>Shared Component : {{'Shared.Desc'|translate}}</div>。原因：您所有的字符串（此处为键）必须用单引号或双引号引起来。

建议：尽量不要在AppModule中包括SharedModule。因为它消除了共享的想法。

无法翻译功能模块中存在的组件中的文本

1 个答案: