Question

我已经创建了自定义元素，并在根repeat上设置template属性似乎没有任何效果。

<link rel="import" href="/components/polymer/polymer.html">
<polymer-element name="cr-tracks">
    <template repeat="{{track in tracks}}">
        {{foo}}
        {{track.title}}
    </template>

    <style>

    </style>

    <script>
        Polymer('cr-tracks', {
            ready: function() {
                this.tracks = [
                    {
                        title: "Example Title",
                        artist: "Example Artist"
                    }
                ];
            },
            foo: 'bar'
        })
    </script>
</polymer-element>

bar，会显示foo的值，但不会为track.title呈现任何内容。我可以通过tracks[0].title直接访问它。

Answer 1

您缺少特殊的外部模板。 Polymer通过将模型设置为元素实例本身来设置外部模板。

试试这个：

<polymer-element name="cr-tracks">
  <template>

    <template repeat="{{track in tracks}}">
      {{foo}}
      {{track.title}}
    </template>

    <style>
    </style>

  </template>
  <script>
    ...
  </script>
</polymer-element>

聚合物模板重复不起作用

1 个答案: