Polymer 将模板动态传递到聚合物元件

我一直在尝试创建一个polymer元素，该元素基于ajax请求生成ul列表，然后基于模板呈现“li”元素，这些模板可以以某种方式传入

基本上，这是一次尝试对“select2”库进行聚合物重建，以实现自动完成

目前为止，我使用的基本模板如下所示：

<polymer-element name="auto-complete" attributes="url_base item_template">
<aj-ax id="xhr" url="{{url_base}}" params="{}" handle_as="json" on-ajax-response="{{handle_res}}" on-ajax-error="{{handle_err}}"></aj-ax>
    <input id="eingabe" type="text" on-keyup="{{process_request}}" on-blur="{{hide_dropdown}}"/>
    <div id="dropdown" hidden?="{{hide}}">
      <ul>
        <template repeat="{{i in items}}">
          <li> i.text 
             <!--
                   the process_request handler makes the ajax request and sets 
                   the "items" and un-hides the dropdown.
                   the above works, but I want to make it more generic so that 
                   you can pass in a template that reads the item model such as
                   <template ref="{{item_template}}" bind></template> 
                   where item_template is the ID of a template in some outside 
                   scope
              -->
          </li>
        </template>
      </ul>
</polymer-element >
    </div>

一、文本

我还尝试创建一个基本的auto-complete.html聚合元素，然后基于auto-complete类型对其进行扩展……但没有效果

有什么想法吗

如果可能的话，我希望坚持使用声明性方法，避免自己用document.createElement构建DOM元素

这可能吗

---

谢谢

实际上，我想出了一个很酷的方法

---

其主要思想是，一旦将任何子模板注入到shadowdom中，您就可以有条件地呈现您的模板（从而可以在范围内通过ref调用它们！）

Wow，这真是太好了！我制作了一个不需要元素用户设置ID的不同版本：