# Programmatically rendering ember components

**URL:** <https://discuss.emberjs.com/t/programmatically-rendering-ember-components/6986>\
**Category:** Uncategorized\
**Created:** [December 26, 2014, 3:14pm UTC](https://discuss.emberjs.com/t/programmatically-rendering-ember-components/6986 "2014-12-26T15:14:58Z")\
**Posts on this page:** 1\
**Showing post:** 8

<div class="post-metadata">

**Author:** ![jeremytm](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/jeremytm/32/10600_2.png) [@jeremytm](https://discuss.emberjs.com/u/jeremytm)\
**Post date:** [July 9, 2015, 4:27am UTC](https://discuss.emberjs.com/t/programmatically-rendering-ember-components/6986/8 "2015-07-09T04:27:56Z")

</div>

Sorry to revive this, but I’ve been looking around for a while with no luck.

How do we then use this to actually render a component **programatically** like the topic title suggests? With JS only?

I know how to add a component using the helper `{{component componentName}}`, but I don’t have the luxury of doing this in a template with what I’m working on. I’m creating an easy to use modal library where I can show a variety of modals from anywhere in the app.

I have a bunch of modals as components. But obviously I don’t want to go to each template and add all modal components in a hidden state, then just show each one as needed.

---

_[View the full topic](https://discuss.emberjs.com/t/programmatically-rendering-ember-components/6986)._