聚合物模板重复不起作用

Question

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

<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不会呈现任何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>