Angular翻译变量替换

Question

我想在我的翻译中使用一个变量，但我不知道如何在我的模板中使用它。

在我的 HTML 模板中：

 <md-input-container class="md-block">
                <md-autocomplete md-no-cache="vm.noCache" 
                                    md-search-text="user.searchUser" 
                                    md-items="userItem in vm.querySearch(user.searchUser)" 
                                    md-item-text="userItem.display"
                                    md-selected-item-change="vm.selectedItemChange(userItem, user)"
                                    md-min-length="0"
                                    required>
                    <md-item-template>
                        <span md-highlight-text="user.searchUser" md-highlight-flags="^i">{{userItem.display}}</span>
                    </md-item-template>
                    <md-not-found>
                        {{ 'user.autocomplete.no_user' | translate:'{ username: user.searchUser }' }}

                    </md-not-found>
                </md-autocomplete>
            </md-input-container>

和我的翻译文件 (json) :

"user": {
            "autocomplete": {
        "no_user" : "No user has been found ({{username}})",
     }
}

如何使用 user.searchUser 来显示该消息？

非常感谢！

Answer 1

您可以创建一个包含所有翻译参数的对象并将其用于翻译，如下所示：

{{ 'user.autocomplete.no_user' | translate:translationParameters }}

看看this plunker how I did it, for more details it's explain at the end of the section Variable replacement in translate filter of Angular Translate doc

Answer 2

这里是直接在 HTML 模板中完成的答案：

{{ 'user.autocomplete.no_user' | translate:{ username: user.searchUser } }}

Answer 3

{{ELEMENT_TRANSLATE|translate}}

{{ 'ELEMENT_TRANSLATE'|translate:'{value: 111 }'}}

{{ 'ELEMENT_TRANSLATE'|translate:{value: user.searchUser} }}

最后一张最好看

Answer 4

这是您在 Angular 5+

中可以做到的

翻译文件：

{
  "HELLO": "Hello {user}"
}

模板：

{ 'HELLO' | translate: { user: "World" } }

显示：Hello World

Angular翻译变量替换

Angular translate variable replacement

angularjs

internationalization

angular-translate