javascript – Polymer 1.0 – 在模板中显示值的问题是=“dom-repeat”

虽然migrating to Polymer 1.0从0.5起我遇到了一件有趣的事情.认为它可能会帮助其他人有类似的问题.

我有一个元素,我正在使用< template is =“dom-repeat”items =“{{customers}}”> …< / template>.我面临的问题是我必须将每个属性绑定放在HTML元素中.我想写的代码如下：

<template is="dom-repeat" items="{{customers}}">
  <div>
    {{item.name}}<br />
    {{item.addr}}, {{item.addr2}}<br />
    {{item.phone}}
  </div>
</template>

但它只显示{{item.name}}的值.原因是其他属性绑定不包含在单独的HTML标记中,它们根本不显示！

我尝试了以下但是也没有工作：

<template is="dom-repeat" items="{{customers}}">
  <div>
    <p>{{item.name}}</p>
    <span>{{item.addr}} {{item.addr2}}</span>
  </div>
</template>

意思是,我把{{item.name}}放在< p> …< / p>中标记并将{{item.addr}}和{{item.addr2}}放在单个< span> …< / span>中标签.

然后我继续把每个属性绑定包装在他们自己的HTML标签中,如下所示：

<template is="dom-repeat" items="{{customers}}">
  <div>
    <p>{{item.name}}</p>
    <span style="display:block">{{item.addr}}, <span>{{item.addr2}}</span></span>
    <span style="display:block;">{{item.phone}}</span>
  </div>
</template>

它的工作原理!!

我真的不知道它是1.0的错误还是我做错了！如果有人知道答案,请帮助.

提前致谢

解决方法:

你没有做错任何事.随着Polymer 0.9(及更高版本1.0)的引入,数据绑定到文本节点的内容只有在将所有内容都包装到自己的元素中时才有效.

见Polymer documentation：

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

所以你必须删除所有空格和其他字符才能工作.

文档中的示例：

<!-- this works -->
<template>   
  First: <span>{{first}}</span><br>
  Last: <span>{{last}}</span>
</template>

<!-- Not currently supported! -->
<div>First: {{first}}</div>
<div>Last: {{last}}</div>

<!-- Not currently supported! -->
<div>
  {{title}}
</div>

编辑

从Polymer 1.2开始,问题中描述的问题不再是问题/错误.复合绑定现在有效,见release notes on the Polymer blog.

标签：javascript,polymer,polymer-1-0
来源： https://codeday.me/bug/20190715/1466321.html