On Fri, Feb 16, 2018 at 11:16 AM, Ronn Ross <[email protected]> wrote:

> Greetings,
>
> I'm attempting to create a small polymer 3 lit-html project. I'm getting
> hung up when lit-html enters the picture. I followed this tutorial:
>
> https://www.polymer-project.org/blog/2017-08-23-hands-on-30-preview
>
> and was able to get the demo project running locally. Then I felt inspired
> and imported lit-html and tried to convert it over. Here is what I have
>
> import { Element as PolymerElement } from '../node_modules/@polymer/
> polymer/polymer-element.js';
> import { html, render} from '../node_modules/lit-html/lit-html.js';
>
> export class MyApp extends PolymerElement {
>    constructor() {
>        super();
>        this.name = '3.0 preview';
>    }
>
>     static get properties() {
>        name: {
>            Type: String
>        }
>    }
>    static get template() {
>        return render(this.render());
>    }
>
>     render() {
>        return html`
>            <div>
>                This is my ${name} app.
>            </div>
>        `;
>    }
> }
>
> customElements.define('my-app', MyApp);
>
> When I run the app it goes from working to
>
> Uncaught TypeError: this.render is not a function
>
> Seems strange since it is a method on the class. I'm sure that I'm missing
> something obvious. Could someone please point me in the right direction?
>

The problem here is that `render()` is an instance method and you're trying
to call it from a static method using `this`. You can't really use lit-html
with the static template system that PolymerElement comes with. We've made
a new base class called LitElement that includes the non-template parts of
Polymer and adds lit-html integration:
https://github.com/PolymerLabs/lit-element



>
> Thanks!
>
> Follow Polymer on Google+: plus.google.com/107187849809354688692
> ---
> You received this message because you are subscribed to the Google Groups
> "Polymer" group.
> To unsubscribe from this group and stop receiving emails from it, send an
> email to [email protected].
> To view this discussion on the web visit https://groups.google.com/d/
> msgid/polymer-dev/9cb1b757-8752-4317-98f2-b68f2465ef1e%40googlegroups.com
> <https://groups.google.com/d/msgid/polymer-dev/9cb1b757-8752-4317-98f2-b68f2465ef1e%40googlegroups.com?utm_medium=email&utm_source=footer>
> .
> For more options, visit https://groups.google.com/d/optout.
>

Follow Polymer on Google+: plus.google.com/107187849809354688692
--- 
You received this message because you are subscribed to the Google Groups 
"Polymer" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to [email protected].
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmBBSzC1ABD4bSoSdO-gAmtTSiV%3Dgnrb%2B9hBtheEdPUyTQ%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.

Reply via email to