Question

我正在学习聚合物。我正在开发自定义元素。我有一点here。我的元素加载了一些数据。这时，我的元素看起来像这样：

<dom-module id="data-library">  
  <template>
    <paper-header-panel flex>
      <div class="flex">
        <template is="dom-repeat" items="[[ items ]]" as="item">
          <div>[[ item.firstName ]]</div>
        </template>
      </div>
    </paper-header-panel>
  </template>

  <script>
    Polymer({
      is: "data-library",
      properties: {
        items: {
          type: Object,
          value: function() {
            return [];
          }
        }
      },

      ready: function() {
        this.push('items', { firstName: 'John' });
        this.push('items', { firstName: 'Bill' });
      }
    });
  </script> 
</dom-module>

我希望消费者能够控制项目的布局。现在，项目始终垂直列出。但是，我想让消费者做类似的事情：

<data-library>
  <item-template><b>[[ item.firstName ]]</b></item-template>
</data-library>

在这种情况下，消费者告诉自定义控件要使用的项模板。有没有办法在Polymer中做这样的事情？如果是这样，怎么样？

Answer 1

这不太容易。 iron-list元素做了类似的事情。来源应该作为灵感。使用铁列表，您可以传递<template><item-template>...</item-template>custom-content</template>

聚合物 - 自定义元素内容

1 个答案: