Polymer 1.0 - 数据绑定数组未正确更新

Question

在这里演示：http://jsbin.com/wiqowo/15/edit?html,output

当我在下面的示例中循环遍历 this.data 时，它会遍历正确数量的项目，但是不会输出单个项目的值。这是一个错误，还是我遗漏了什么？

<dom-module id="test-element">
  <template>
    <h3>data</h3>
    <p>data: <span>{{data}}</span></p>
    <ul>
      <template is="dom-repeat" items="{{data}}">
        <li>{{item}}</li>
      </template>
    </ul>
  </template>
  <script>
    Polymer({
      ready: function() {
        this.data = ['Item #1', 'Item #2', 'Item #3'];
        for (var i=this.data.length; i<10; i++) {
          this.data.push('Item #' + (i+1));
        }
        console.log(this.data);
      }
    });
  </script>
</dom-module>

Answer 1

想通了。显然 1.0 不支持数组突变。您必须调用新的Polymer.push、Polymer.pop 等方法。

演示：http://jsbin.com/wiqowo/25/edit?html,output

for (var i=this.data.length; i<10; i++) {
    this.push('data', 'Item #' + (i+1));
}

Answer 2

在 ready 函数内部定义一个数组 var，并将数据推送到它。然后，将其分配给this.data。

Polymer({
  ready: function() {
    var localData = ['Item #1', 'Item #2', 'Item #3'];
    for (var i=localData.length; i<10; i++) {
      localData.push('Item #' + (i+1));
    }

    this.data = localData;

    console.log(this.data);
  }
});