javascript - Polymer 中的动态数据绑定(bind)

Question

我正在尝试在 dom-repeat block 中绑定(bind) polymer 组件的属性。在以下(伪代码)示例中，我尝试将 elem-a 的属性绑定(bind)到 elem-b 的属性:

<template is="dom-repeat" items="[[data]]">
      <elem-a></elem-a>
      <elem-b prop-of-b={{prop-of-a}}></elem-b>
 </template>

但在此上下文中，{{prop-of-a}} 被视为 dom-repeats 宿主元素的属性。

是否可以像上面示例中那样在 dom-repeat 中绑定(bind)属性？

Answer 1

是的，这是可能的。

您必须绑定(bind) <elem-a>.propOfA到宿主元素中的中间属性，并将该属性绑定(bind)到 <elem-b>.propOfB :

<elem-a prop-of-a="{{a}}"></elem-a>
<elem-b prop-of-b="[[a]]"></elem-b>

在 dom-repeat 内，您必须绑定(bind) <elem-a>.propOfA 的每次迭代通过绑定(bind)到迭代器实例(默认命名为 item)到主机中的唯一中间属性:

<template is="dom-repeat" items="[[data]]">
  <elem-a prop-of-a="{{item.a}}"></elem-a>
  <elem-b prop-of-b="[[item.a]]"></elem-b>
</template>

demo