Angular:我可以将翻译与异步管道一起使用吗？

Question

在 HTML 模板中将翻译管道与异步管道一起使用的最佳方法是什么？

例如，假设 'foo' 和 'bar' 有值:

{{ 'foo' | translate: '{ bar: (bar$ | async) }' }}

编译后显示为空。

Answer 1

您应该不是 为 translate 添加引号目的。

<!-- Works! -->
{{ 'foo' | translate: { bar: (bar$ | async) } }}




<!-- Doesn't work -->
{{ 'foo' | translate: '{ bar: (bar$ | async) }' }}

ERROR SyntaxError: Wrong parameter in TranslatePipe. Expected a valid Object, received: { bar: (bar$ | async) } 
at TranslatePipe.push../node_modules/@ngx-translate/core/fesm5/ngx-translate-core.js.TranslatePipe.transform (ngx-translate-core.js:1178)