如何在 Polymer 2/3 中使用基于模板的元素？答案

【问题标题】：How to use template-based elements in Polymer 2/3?如何在 Polymer 2/3 中使用基于模板的元素？
【发布时间】：2018-10-02 22:38:46
【问题描述】：

某些元素，例如iron-list，需要template 元素作为子元素。但是，Polymer 3 strips templates of its content。

这些看似矛盾的原则应该如何协同工作？请参阅 jsbin 示例@https://www.webcomponents.org/element/@polymer/iron-list（由于嵌套模板为空，它们不起作用）。

preserve-content 导致缺少绑定功能，因此这不是可行的解决方案。这个template-stripping 的原因是什么？（文档只是说“更好的性能”。）

【问题讨论】：

在 Chrome 69.0.3497.100 x64 和 Firefox 62.0.3 x64 和 Polymer 2.6.1 中测试。

标签： polymer custom-element polymer-3.x

【解决方案1】：

给定的示例已经更新，现在可以使用了。

似乎 v3 元素和 v2 聚合物核心的组合导致了失败。

我个人的猜测是，基于template 的元素是手动Templatizer-ing 他们的孩子templates 来标记template 的内容，即使template 的实际content 是undefined。 Templatizer 似乎访问了文档中提到的缓存 content。

【讨论】：