不能在标签内使用数据绑定<table>，IE 10(其他浏览器可以)

Question

我正在尝试使用Polymer 1.0创建一个数据表组件。我遇到了一个奇怪的问题，只有在IE10上才会出现(经过验证的Chrome和Firefox都可以)。

下面的代码无法显示绑定数据的内容:

<table>
      <tr>
        <template is="dom-repeat" items="{{columns}}" as="col" index-as="colIndex">
          <th>
            <div>++</div>
            <div>{{colIndex}}</div>
            <div>--</div>
            <div>{{col.title}}</div>
            <div>++</div>
          </th>
        </template>
      </tr>
 </table>

用IE10的DOM浏览器检查结果，我可以看到没有数据绑定没有替换{{colIndex}}和{{col.title}}。

如果我删除<table>和</table>标签，数据绑定是OK的。有人遇到过同样的问题吗?

Answer 1

是的，惊喜，惊喜，这是一个IE渲染错误。IE对于可以在表元素中使用的元素类型非常挑剔，而Polymer将标签留在DOM中。

这是Github问题的链接:

https://github.com/Polymer/polymer/issues/1567

我们在一个项目中很晚才发现这一点。解决方案是用基于自定义的构造替换所有表和选择。在问题评论中有一个链接，可以让你开始这条不幸的道路。