Artifact
10d106afb51a446f85e6534fb237957f5e1fad5af6f2b33656e79ccbc1a230a8:
<blog>
<h1>{ title }</h1>
<my-post each={ posts }>
<a href={ this.parent.backToHome }>Back to home</a>
<div onclick={ this.parent.deleteAllPosts }>Delete all the posts</div>
</my-post>
this.backToHome = '/homepage'
this.title = 'my blog title'
this.posts = [
{ title: "post 1", description: 'my post description' },
{ title: "post 2", description: 'my post description' }
]
// the bind is needed in this case to keep the parent context
// also in the child tags
deleteAllPosts() {
this.posts = []
// we need to trigger manually the update function
// because this function gets triggered from a child tag
// and it does not bubble up automatically
this.update()
}.bind(this)
</blog>
<my-post>
<h2>{ title }</h2>
<p>{ description }</p>
<yield/>
</my-post>