Skip to content

Instantly share code, notes, and snippets.

@CaptainCodeman
Created September 10, 2016 16:45
Show Gist options
  • Save CaptainCodeman/94ac1f1a4b9220528ab4901b479826fe to your computer and use it in GitHub Desktop.
Save CaptainCodeman/94ac1f1a4b9220528ab4901b479826fe to your computer and use it in GitHub Desktop.
Polymer 2.0 Element
<!doctype html>
<head>
<base href="https://polygit.org/polymer+:2.0-preview/webcomponentsjs+webcomponents+:v1/custom-elements+webcomponents+*/shadydom+webcomponents+*/shadycss+webcomponents+*/components/">
<script src="webcomponentsjs/webcomponents-lite.js"></script>
<link href="polymer/polymer-element.html" rel="import">
</head>
<body>
x-app: <x-app></x-app>
<dom-module id="x-app">
<template>
<style>
:host {
border: 1px solid #00f;
}
</style>
Hello [[name]]
</template>
<script>
class XApp extends Polymer.Element {
static get is() { return 'x-app'; }
static get config() {
return {
properties: {
name: {
type: String,
value: 'CaptainCodeman'
}
}
};
}
constructor() {
super();
console.log('ctor');
}
connectedCallback() {
super.connectedCallback();
console.log('connectedCallback');
}
ready() {
super.ready();
console.log('ready');
}
}
addEventListener('WebComponentsReady', function() {
customElements.define(XApp.is, XApp);
});
</script>
</dom-module>
</body>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment