javascript - 将演示数据放入 core-list

Question

polymer 网站给出了使用 core-list 的示例:

<core-list data="{{data}}" height="80">
  <template>
    <div class="{{ {selected: selected} | tokenList }}">List row: {{index}}</div>
  </template>
</core-list>

但是没有任何地方解释我如何使用 html/js 将一些简单的测试数据放入此列表中。所有示例都涉及创建自定义元素，但我仍在尝试了解框架，并且只想将一些简单的数据放入列表中!

谁能给我解释一下该怎么做吗？

Answer 1

根据您使用 core-list 的方式，此问题有多个答案。由于您询问了简单的测试数据，我假设您的标记位于您的主文档(index.html)中，在这种情况下，一种简单的方法如下所示:

<core-list height="80">
  <template>
    <div class="{{ {selected: selected} | tokenList }}">List row: {{index}}</div>
  </template>
</core-list>

<script>
  document.querySelector('core-list').data = [{"index": 0}, {"index": 1}, {"index": 2}];
</script>

http://jsbin.com/jasus/1/edit

Fwiw，您应该能够通过在 data 属性中向 core-list 提供 JSON 来完成此操作，但是该元素 isn't properly type-hinting该属性是对象值的。当这个问题得到解决后，你可以这样写:

<core-list height="80" data="[{'index': 0}, {'index': 1}]">