javascript - Polymer, IE11 dom-repeat no rendering option 标签

Question

我遇到了 IE11 的问题。此代码在 Chrome/Firefox/Edge 中运行良好。我不明白我在做什么会导致它不起作用。

这是我的 polymer 元素的影子 dom 损坏的部分:

  <template is="dom-if" if="[[showSelect]]]">
    <select value="{{selectValue::change}}">
      <option value="0" selected$="{{matchesDefault(0)}}">All</option>
      <template is="dom-repeat" items="{{excludeNumbers}}" as="number">
        <option value="[[number]]" selected$="[[isExclude(number)]]">Skip [[number]]s</option>
      </template>
    </select>
  </template>

我在 Chrome/FF/Edge 但不是 IE11 中尝试做的事情:

• 如果已设置，则显示影子 dom <select> .
• 绑定(bind) this.selectValue 以在下拉列表更改时更新。
• 遍历this.excludeNumbers并将它们写成 <option>嵌套在 <select> 中, 选择它们，如果它们是

到目前为止我测试过的内容:

• 从 <option> 中删除所有属性标签
  • 结果:没有变化，仍然不渲染
• 删除默认 <option value="0" selected$="{{matchesDefault(0)}}">All</option>从标记
  • 结果:没有变化，仍然不渲染
• 移动 <template is="dom-repeat"> <select> 之外的标记, 刚下开口<template>检查的标签是 [[showSelect]]从 <option> 设置和更改它们至 <span>标签。
  • 结果:成功写入span标签
• 正在运行 polymer build并在构建的代码上测试 IE10
  • 结果:没有变化

有没有人看出我哪里错了？关于我可以测试什么的任何想法？

感谢任何想法

Answer 1

这是一个已知问题，tables 和 selects 在 IE11 中不能与 dome-repeat 一起使用 在 Github here 中打开了这个问题没有有效的解决方案

一个解决方案是使用自定义元素，可能类似于 paper-dropdown-menu