聚合物递归模板绑定

Question

我正在努力迁移在Polymer 0.5中使用递归模板绑定的自定义元素.自定义元素的HTML代码如下:

<template>
    <template bind="{{ items }}" id="t">
        <section id="{{ id }}"  appName="{{ id }}">
             <template ref="t" repeat="{{ children }}"></template>
        </section>
    </template> 
</template>

我如何在Polymer 0.9中编写相同的构造？如果该功能尚未支持,是否有计划将其包含在Polymer的未来版本中？

谢谢

Answer 1

您可以在自身中包含自定义元素:

我-recursive.html

<link rel="import" href="../polymer/polymer.html">

<dom-module id="my-recursive">
  <template>
    <template is="dom-repeat" items="{{data}}">
      <section id="{{item.id}}" appName="{{item.id}}">
        <my-recursive data="{{item.children}}"></my-recursive>
      </section>
    </template>
  </template>
</dom-module>

<script>
  Polymer({
    is: 'my-recursive'
  });
</script>

的index.html

<my-recursive
  data='[{"id":1,"name":"top1","children":[{"id":3,"name":"mid1","children":[]},{"id":5,"name":"mid3","children":[]}]},{"id":2,"name":"top2","children":[{"id":4,"name":"mid2","children":[]}]}]'
></my-recursive>