如何在指令字段中使用翻译？

Question

我构建了一个 Angular 应用程序，我想在我的整个应用程序中添加翻译。为此，我使用 ngx-translation method。我在使用参数构建翻译时遇到问题：我的应用程序显示 [Object object]。我使用了一个使用 [message] 字段的指令，这个值需要翻译，但我不知道如何在我的消息值中添加翻译。

我的组件如下：

<app-confirmation-dialog  
[translate]="'demo.greeting'" 
[translateParams]="{name: 'Andreas'}"
[message]="?????????"
[confirmationLabel]="'quit anyway'"
(onConfirmation)="onCancel()"></app-confirmation-dialog>

我在翻译文件中添加了相同的密钥：

{
  ....
  "demo": {
    "greeting": "Hello {{name}}!"
  }
  ....
}

你有什么想法在我的消息值中添加翻译吗？

Answer 1

在这种情况下，您将无法轻松使用翻译的指令形式，因为您将 message 作为元素的属性（在本例中为指令的输入）传递。如果您继续使用指令形式 [translate] 那么它会以您不希望的方式扰乱您自己的指令。

而是使用管道形式，将参数对象作为参数传递：

<app-confirmation-dialog
  [message]="'demo.greeting' | translate: {name: 'Andreas'}"
  [confirmationLabel]="'quit anyway'"
  (onConfirmation)="onCancel()">
</app-confirmation-dialog>

如何在指令字段中使用翻译？

How to use translation in a directive field?

translation

ngx-translate

angular