Created
August 1, 2018 12:43
-
-
Save vpalmisano/1d558f8c7e68ae2bb96c5631af55aa37 to your computer and use it in GitHub Desktop.
Polymer Bin // source http://jsbin.com/gixuwad
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset="utf-8"> | |
| <title>Polymer Bin</title> | |
| <link href="https://unpkg.com/@polymer/[email protected]/polymer.html" rel="import" > | |
| <link href="https://unpkg.com/@polymer/[email protected]/polymer-element.html" rel="import" > | |
| <style> | |
| </style> | |
| </head> | |
| <body> | |
| <dom-module id='x-test'> | |
| <template> | |
| <template id="template"> | |
| <h1>Title</h1> | |
| <h1>[[greeting]]</h1> | |
| </template> | |
| </template> | |
| <script> | |
| /** | |
| * @polymer | |
| * @customElement | |
| * @appliesMixin News.OutletMixin | |
| */ | |
| class XTest extends Polymer.Element { | |
| static get is () { return 'x-test'; } | |
| ready () { | |
| super.ready(); | |
| // Get a template from somewhere, e.g. light DOM | |
| let template = this.shadowRoot.querySelector('#template'); | |
| // Prepare the template | |
| let TemplateClass = Polymer.Templatize.templatize(template, this, {}); | |
| // Instance the template with an initial data model | |
| let instance = new TemplateClass({greeting: 'Hi'}); | |
| // Insert the instance's DOM somewhere, e.g. element's shadow DOM | |
| this.shadowRoot.appendChild(instance.root); | |
| } | |
| } | |
| window.customElements.define(XTest.is, XTest); | |
| </script> | |
| </dom-module> | |
| <x-test></x-test> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment