# How to update the template of a view in runtime?

**URL:** <https://discuss.emberjs.com/t/how-to-update-the-template-of-a-view-in-runtime/4345>\
**Category:** Uncategorized\
**Created:** [March 2, 2014, 6:33pm UTC](https://discuss.emberjs.com/t/how-to-update-the-template-of-a-view-in-runtime/4345 "2014-03-02T18:33:01Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![cibernox](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/cibernox/32/15004_2.png) [@cibernox](https://discuss.emberjs.com/u/cibernox)\
**Post date:** [March 2, 2014, 6:33pm UTC](https://discuss.emberjs.com/t/how-to-update-the-template-of-a-view-in-runtime/4345/1 "2014-03-02T18:33:01Z")

</div>

First of all I’ll explain what I want to archieve because maybe I’m taking the wrong way.

I want to have a textarea where I write a Handlebars template and a div in the page where that template is rendered live, as I am writting it (unless it has syntax errors). Is for an interactive presentation.

My approach right now was to create a application and in its `IndexView` define a `template: Ember.Handebars.compile("Hello {{name}}")`. Outside the application, I listen for the keyup event on the textarea to get the new text live.

I tried to get the view instance and `set('template', ...)`

I also tried to reopen the `App.IndexView` and override the template.

Also tried both ideas and called `rerender()` on the view.

No effect, the view is never updated. Any idea?

---

<div class="post-metadata">

**Author:** ![xeppelin](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/xeppelin/32/16615_2.png) [@xeppelin](https://discuss.emberjs.com/u/xeppelin)\
**Post date:** [March 3, 2014, 7:53am UTC](https://discuss.emberjs.com/t/how-to-update-the-template-of-a-view-in-runtime/4345/2 "2014-03-03T07:53:41Z")

</div>

While I couldn’t tell you off the top of my head how to update the _view’s_ template directly, there is the `{{partial}}` helper + bound template names you can get away with real cheap: [http://emberjs.jsbin.com/gotihaya/1/edit](http://emberjs.jsbin.com/gotihaya/1/edit)

More info on bound template names: [Ember - 4.6 - Ember API Documentation](http://emberjs.com/api/classes/Ember.Handlebars.helpers.html#toc_bound-template-names)

---

<div class="post-metadata">

**Author:** ![cibernox](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/cibernox/32/15004_2.png) [@cibernox](https://discuss.emberjs.com/u/cibernox)\
**Post date:** [March 3, 2014, 8:53am UTC](https://discuss.emberjs.com/t/how-to-update-the-template-of-a-view-in-runtime/4345/3 "2014-03-03T08:53:09Z")

</div>

Sooooo, i could dynamically register templates as I type (naming them with a timestamp or any uniq identifier) and dynamically update the template name to that identifier.

Sounds possible. I’ll try tonight. Thanks

---

<div class="post-metadata">

**Author:** ![xeppelin](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/xeppelin/32/16615_2.png) [@xeppelin](https://discuss.emberjs.com/u/xeppelin)\
**Post date:** [March 3, 2014, 3:51pm UTC](https://discuss.emberjs.com/t/how-to-update-the-template-of-a-view-in-runtime/4345/4 "2014-03-03T15:51:31Z")

</div>

Here is the version you wanted, with dynamic `templateName` property on `App.IndexView`: [http://emberjs.jsbin.com/vibut/3/edit](http://emberjs.jsbin.com/vibut/3/edit)
