Menu
Is there any way to surround a polymer child template with its parent's template?
In the following example shadow tag bring the parent's template into the child view, but it's ignoring its content:
Parent polymer element
<polymer-element name="my-window">
<template>
<div class="windowframe">
<p>test</p> <!-- can be shown with shadow tag -->
<content></content> <!-- cannot be used with shadow tag -->
Child polymer element
<polymer-element name="my-window-example" extends="my-window">
<template>
<!-- get the hosts' shadow and insert here -->
<shadow>
<p>Here is the content of my window<p> <!--won't be shown -->
</shadow>
</template>
832
An element that extends another Polymer element can inherit its template. If the element doesn't provide its own DOM template (using either a <dom-module> or a static template object), Polymer uses the same template as the superclass, if any.
If you want to access the contents of a nested template, you can add the preserve-content attribute to the template. Preserving the contents of a nested template means it won't have any Polymer features like data bindings or declarative event listeners.
A static nested class can inherit: a static nested class that is declared in an outer class or its ancestors Recall an example from our lesson on static nested classes.
DOM templating provides an easy way to create a DOM subtree for your element. By default, adding a DOM template to an element causes Polymer to create a shadow root for the element and clone the template into the shadow tree. The DOM template is also processed to enable data binding and declarative event handlers.
This used to be possible in Chrome Canary (see this blog post, this discussion, the fixed spec bug, and the fixed Chromium bug), but unfortunately it doesn't seem to be working for me anymore in Chrome 33.0.1750.22 dev on Linux or Chrome 34.0.1809.0 canary on Windows with the "Enable experimental Web Platform features" flag on or off. Try this jsbin to see if it works for you.
Update: Confirmed. This feature was removed from the initial implementation of Shadow DOM in Chrome due to "implementation concerns."
89
I guess you would need functionality like the select='selector' attribute of the <content> tag for the <shadow> tag where you can select a few nodes from the older shadow and position them with one <shadow> tag and select and position the rest with a second <shadow> tag.
I haven't found anything about this though and I am quite sure that this isn't supported.
This discussion might be interesting https://groups.google.com/a/dartlang.org/forum/#!topic/web-ui/zR64jebST4c
40
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
