根据条件显示HTML按钮上的i18n文本Aurelia

Question

嗨我试图根据布尔值动态更改文本。 即时通讯使用Aurelia与i18n，一个解决方案将只是有一个方法，返回你想要的。但我想在html中使用它，因为我认为它更清晰，可以根据html代码中的bool来查看该按钮将具有哪些文本。 这是它看起来像现在：

<button>${account.changed ? '_cancel' | t : '_close' | t } </button> 

这是我曾尝试：

<button>${account.changed ? ('_cancel' | t) : ('_close' | t) } </button> 
<button>${account.changed ? ${'_cancel' | t} : ${'_close' | t} } </button> 

我尝试的任何一个崩溃结束：

Error: Parser Error: Conditional expression account.changed ? '_cancel' requires all 3 expressions at column 33 in [account.changed ? '_cancel' | t : '_close' | t ] 

我只用i18N喜欢这个到这一点：

<div>${'example | t'}</div> 

根据条件之前，不需要更改文本。

要到这里来的人，我解决了这个这样：

innerHTML.bind="!account.changed ? close : cancel" 

，并在.js文件

this.close = this.i18n.tr('_close'); 
    this.cancel = this.i18n.tr('_cancel'); 

我认为它应该以某种方式来实现这一目标是可能的用aurelia直接在HTML中

Answer 1

这就是我正在使用的：

​​

我被困在这一段时间，这是我发现的最好的方式。

Answer 2

不幸的是，解析器目前不支持嵌套表达式。在此同时，你可以使用一些挂羊头卖狗肉，如：

<button ref="myButton" cancel-text="${'_cancel' | t}" close-text="${'_close' | t}">${account.changed ? myButton.cancelText : myButton.closeText}</button> 

Answer 3

如果你看一看ValueConverters在奥里利亚是如何工作的，你会看到，他们利用管道符号。这可以像你期望的经典的unix风格管道那样工作，左边的表达式输出被转发到管道后面的下一个东西。

所以您的解决方案应该是这样的：

<button>${account.changed ? '_cancel' : '_close' | t }</button> 

首先确定使用速记如果语法和因此而引起的大干快上到TValueConverter传递正确的琴弦。