Polymer，IE11 dom-repeat没有渲染选项标签

Posted 2021-04-12

我有专门针对IE11的问题。此代码在Chrome / Firefox / Edge中运行良好。我不知道我在做什么会导致这不起作用。

这是我的聚合物元素阴影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>。
• 绑定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 结果：没有变化

有谁看到我错了？关于我可以测试的任何想法？

任何想法都表示赞赏

答案

这是一个众所周知的问题，tables和selects在IE11中不与dome-repeat一起工作在Github here有一个问题没有工作解决方案

一种解决方案是使用自定义元素，可能像paper-dropdown-menu