如何在Polymer 2.x中重复<option>标签?

时间:2017-02-03 11:57:35

标签: polymer polymer-2.x

在Polymer 1.0中,我会重复<option>标记内的<select>标记,如下所示:

<select>
  <template is="dom-repeat" items="{{items}}">
    <option value$="[[item]]">[[item]]</option>
  </template>
</select>

但在Polymer 2.x中,建议使用<dom-repeat>标记:

<select>
  <dom-repeat items="{{items}}">
    <template>
      <option value$="[[item]]">[[item]]</option>
    </template>
  </dom-repeat>
</select>

但这不起作用。那么如何在Polymer 2中重复<option>个标签?

1 个答案:

答案 0 :(得分:4)

此问题与one reported for <dom-repeat> inside <table>类似。

现在的解决方法是使用“混合模式”,其中2.0 <dom-repeat>包裹<template is="dom-repeat">

<select>
  <dom-repeat items="[[items]]">
    <template is="dom-repeat" items="[[items]]">
      <option value="[[item]]">[[item]]</option>
    </template>
  </dom-repeat>
</select>

codepen

更新: @DocDude(聚合物团队的Arthur Evans)noted in Slack仍然支持使用<template is="dom-repeat"> 在Polymer 2.0元素内。您只需要使用元素外部的element包装器(例如,在index.html中)。

slack discussion

来自Polymer核心团队的@KevinShaaf也confirmed this in GitHub

github comment