聚合物多个变量在模板中彼此相邻

Question

我的约会对象：

date = { day: '05' }

这个：

<div>{{date.day}}</div>

给我以下 HTML 输出：

<div>05</div>

这很好。

现在，我想这样做：

<div>{{date.day}}. {{date.day}}</div>

应该如下所示：

<div>05. 05</div>

我得到的是一个空字符串。这是为什么？

我找到了一个 article，它使用完全相同的语法：

<div>{{i + 1}}. {{fruit}}</div>

我正在使用 Polymer 1.0。内容被 <template> 标记包围。

Answer 1

您引用的文章使用了旧版本的 Polymer。在您现在使用的 1.0 中，不再支持此语法。 documentation

中对此进行了解释

The binding annotation must currently span the entire content of the tag.

您可以使用 computed bindings 来获得相同的结果。

Answer 2

在 Polymer 1.0 中，仅支持绑定到文本节点if the binding fills the entire tag。目前不能有空格或多个标签。

您有两个选择：

<div>{{fillMyContent(date.day, date.day)}}</div>

你在哪里定义了一些函数 fillMyContent 其中 returns 所需的值。

或者：

<div><span>{{date.day}}</span>. <span>{{date.day}}</span></div>

使用您可以完全填充的单个虚拟元素。

Polymer multiple variables next to each other in template