Javascript 聚合物嵌套dom重复序列

我对Polymer的

有些问题

我有父对象（文件夹）和子对象（文件夹的内容）。两者都是根据对AJAX请求的响应计算的

结果应该是：

文件夹

• 孩子
• 孩子
• 孩子

我的代码：

<iron-ajax id="folder" url="../Folder" auto last-response="{{folders}}"></iron-ajax>

<template is="dom-repeat" items="{{folders.items}}" as="folder">
  <paper-card  on-tap="openFolder" object item="[[folder]]">

    <custom-object value="[[folder]]" link></custom-object>
     
    <iron-ajax id="folder" url="..[[folder.id]]/children" auto last-response="{{children}}"></iron-ajax>

    <template is="dom-repeat" items="{{children.items}}" as="children"> 
      <custom-object style="margin-top: 15px" value="[[children]]" link></custom-object>
    </template>

  </paper-card>
</template>

---

问题是每个文件夹都会成为最后一个文件夹的子文件夹，而不是自己的子文件夹。

您的内部

iron ajax

会在中继器的每次迭代中写入相同的

子文件夹

属性。repeater不限定该属性的范围，它实际上对每个迭代和repeater外部的整个模板都是可见的。后续迭代可能会覆盖上一次迭代的

子项

，这表现为意外的文件夹嵌套

解决这一问题的一种方法是通过将

子项

属性附加到迭代器（即在本例中为

文件夹

）来为每个迭代确定其范围。为了避免与实际属性的潜在名称冲突，最好在其前面加上前缀（例如，

folder.\u children

），如本例所示：

<iron-ajax id="folder" url="../Folder" auto last-response="{{folders}}"></iron-ajax>

<template is="dom-repeat" items="{{folders.items}}" as="folder">
  <paper-card  on-tap="openFolder" object item="[[folder]]">

    <custom-object value="[[folder]]" link></custom-object>


    <!--
        attach a new property `_children` to `folder` to contain the response for this folder
    -->
    <iron-ajax url="..[[folder.id]]/children" auto last-response="{{folder._children}}"></iron-ajax>


    <template is="dom-repeat" items="{{folder._children.items}}" as="children"> 
      <custom-object style="margin-top: 15px" value="[[children]]" link></custom-object>
    </template>
  </paper-card>
</template>