Loading Components when routing Ember 1.13

Learning Team
1

Currently I have an Ember 1.12 application within my Rails application. I’m upgrading to Ember 1.13. The biggest thing is converting all our existing views into components. I’ve gone through and done the basic small components, but now I’ve moved onto the page views (model_index, model_show, model_manage for example).

I can’t seem to get the component rendered/loaded through routing. If for example I visit /posts, I’d want the Post index component (posts_index_component.coffee) to be rendered. But this doesn’t happen.

My application.hbs is simply:

<div>
    {{outlet}}
</div>

Currently what happens is that it’ll find the template under templates/posts/ as index.hbs and render that, but it doesn’t set up with the component. I try adding a log/debugger in the didRender within the components/posts_index_component and nothing comes up. If the view file still existing, as in views/posts_index_view.coffee, then that will actually get loaded. I tried moving the template from templates/posts/ to templates/components/posts and renamed the template to posts-index.hbs and still nothing.

Do I have to configure my Router to have it look up templates through templates/components instead of templates/?

I’m pretty new to Ember so please let me know if I missed anything.

2

Perhaps take a look at this:

https://github.com/broerse/ember-cli-blog/blob/master/app/templates/components/blog-posts.hbs

3

Ooh that is an idea. Is this an acceptable way of working with components? Makes sense doing it like this, but I’d still like to know. Thanks for the help.

Edit: Also it seems like the controller context is not passed through, which means I have to pass the controller to the component as well, however it looks like I can’t actually override the controller, and have to pass it under a new name