如何在Transloco Translate API中获取作用域内嵌套翻译值

你在使用Transloco时遇到的作用域下嵌套翻译键调用问题，我来帮你梳理下正确的处理方式：

情况1：组件已配置TRANSLOCO_SCOPE #

你已经在组件的providers里指定了作用域为dashboard，这意味着当前组件的翻译上下文已经限定在这个作用域内了，所以不需要再在键名前加dashboard.前缀，直接调用嵌套的键即可：

const title = this.translocoService.translate('title');

这样就能正确获取到en.json里dashboard.title对应的"Dashboard Title"值。

情况2：明确指定作用域（跨作用域或未配置组件作用域） #

如果你需要在其他组件调用这个翻译值，或者不想依赖组件的作用域配置，可以通过translate方法的第三个参数传入read选项，和你在模板里用read: 'guest-register'的逻辑完全一致：

const title = this.translocoService.translate('title', {}, { read: 'dashboard' });

这里的read参数会告诉Transloco去dashboard作用域下查找title键。

为什么你原来的写法无效？ #

你之前写的this.translocoService.translate('dashboard.title')，因为组件已经配置了dashboard作用域，Transloco会在dashboard这个作用域下去找dashboard.title这个键——但你的en.json里dashboard对象下只有title和desc，并没有dashboard子对象，所以自然找不到对应的值。

另外补充下，模板里的用法也可以对应调整（和你现有写法呼应）：

<div class="ui-g" *transloco="let t; read: 'dashboard'">
  {{ t('title') }}
</div>

内容的提问来源于stack exchange，提问作者Martin Andersen