如何在聚合物中导入模板？

Question

I want create template libraray in isolated file.

./my-components/templates.html

<template id="overTemplate">
    <div on-mouseover="{{mouseOverHandler}}">OVER</div>
</template>
.....

And connect this file in my polymer-element:

<link rel="import" href="./my-components/templates.html">

Then use this template:

<template bind ref="overTemplate"></template>

How to do it?

Answer 1

The above does not work with Polymer 1.0 as template annotation bindings are no longer dynamic based on DOM modifications. There is a tag , currently a stop gap until the Polymer team provides that ability, that attempts to provide reference templates.

Answer 2

How about?

var link = document.querySelector('link[rel=import]');
var content = link.import.querySelector('#overTemplate');
document.body.appendChild(document.importNode(content, true));

Credits to Mr 'Polymer' Dodson... http://robdodson.me/blog/2013/08/20/exploring-html-imports/

Polymer has a helper called import but as far as I can tell it is ready to import polymer-elements only.