polymer 铁列表动态添加项目？

Question

我正在尝试将一些代码从 Polymer 0.5 迁移到 1.x，这意味着从 core-list 迁移到 iron-list。但是，我无法弄清楚如何将项目添加到核心列表中。

<core-list height="85">
<template>
<div class="{{ {selected: selected} | tokenList }}" style="padding:5px;"><paper-fab mini icon="arrow-forward" title="arrow-forward"></paper-fab> <!--{{index}}-->{{model.name}}</div>
</template>
</core-list>

这被称为更新...

document.querySelector('core-list').data = $.parseJSON('[{"name":"One"},{"name":"Two"}]');

有人有什么建议吗？

更新:2015 年 7 月 23 日下午 12:20 PST
@Zikes

根据发布的建议，我有以下内容。

<dom-module id="my-element">
  <template>
    <iron-list items="[[myItems]]" as="item">
      <template>
        <div>[[item.name]]</div>
      </template>
    </iron-list>
  </template>
  <script>
    Polymer({
      is:'my-element',
      properties: {
        myItems: Array
      },
      addItem: function(item) {
        this.push('myItems', {name: item});
      }
    });
  </script>
</dom-module>

如果设置正确，我将如何从其他地方调用 addItem 方法？

更新:2015 年 7 月 23 日下午 1:58 PST
@Zikes

以下是我当前的代码。虽然我可以操作数组，但在 ready 或 addItem 方法中添加的值不会显示。

<dom-module id="fnord-element">
  <template>
    <iron-list items="[[myItems]]" as="item">
      <template>
        <div class="item">[[item.name]]</div>
      </template>
    </iron-list>
  </template>
  <script>
    Polymer({
      is:'fnord-element',
      properties: {
        myItems: {
            type: Array,
            notify: true
        }
      },
      addItem: function(item) {
        //this.push("myItems", {"name":item});
        this.myItems=[{name:item}];
        alert(this.myItems[0].name);
        //alert(item);
      },
      ready: function() {
        //alert('fnord');
        this.myItems=[{name:"One"},{name:"Two"}];
      }
    });
  </script>
</dom-module>
<fnord-element id="fnord"></fnord-element>
<paper-button raised onclick="document.querySelector('#fnord').addItem('John Doe');">Test</paper-button>

Answer 1

iron-list使用 items属性来生成其项目，类似于 dom-repeat .您可以做的只是将它绑定(bind)到组件中的 Array，如下所示:

<dom-module id="my-element>
  <template>
    <iron-list items="[[myItems]]">
      <template>
        <div>[[item]]</div>
      </template>
    </iron-list>
  </template>
  <script>
    Polymer({
      is:'my-element',
      properties: {
        myItems: Array
      }
    });
  </script>
</dom-module>

然后，只需关注 the rules for modifying an Array property一切就绪!