lit-html property binding

by Aggre _--

HTML

<script type=module>
import { html, render } from 'https://unpkg.com/lit-html?module'

customElements.define('x-sub', class extends HTMLElement {
	connectedCallback() {
  	// オブジェクトに z を追加
    this.item.z = 'z'
  }
})

const fooItem = {
	x: 'x',
  y: 'y'
}

render(html`<x-sub .item='${fooItem}'></x-sub>`, document.body)

alert(JSON.stringify(fooItem))
</script>