How to use dynamic html for get template method?

[Damien Golding]

I am trying to make a web component that can change the html later.

I tried using the get template method but when I used a variable, it did not work. It only worked when using a string. The same happened when not using the html template function and instead just creating my own template element.

What causes this to happen?
What is the best practice?

Additionally, I would like to have a reference to the element so I can do element.querySelector(subElement). Is the below really the best way to achieve this?

https://stackoverflow.com/a/43007027/1764521

[Thad Humphries]

What are you using? Polymer 2, 3, or LitElement (I strongly urge the latter).

If Polymer, you can access an element with const elem = this.$.[dom_id]....

If LitElement, you access an element with const elem = this.shadowRoot.getElementById('[dom_id]') or any querySelector() wish.

Once you have access to an item in your element, say a <div>, you can 

const child = document.createElement('some-element'); // anything you wish

elem.appendChild(child);

If you are working with Polymer or LitElement, I urge you to join the Polymer Slack channel. Almost no one checks here.

[Damien Golding]

Thanks for the fast reply.

I am using Polymer 3. I will look into LitElement more, I am just trying to be able to use Polymer enough to use with my other projects just in case.

The $ worked well. The LitElement way sounds a lot better.

Do you know how the get template Polymer function works? It is a little confusing that a variable can not be used. Why is this?

I just joined the Slack channel. Thanks.

[Thad Humphries]

"static get template()" creates the HTML block that in Polymer 2 was between the outermost <template> tag of the <dom-module>. It is designed to take display properties in [[]] (one-way binding) and {{}} (two-way binding).

Although I started with <template> in Polymer 0.8 and through v2, I find LitElement's approach a lot simpler to grasp.

[Damien Golding]

Thanks, I'll try out LitElement too.