When to use all the cool stuff to encapsulate functionallity: {{render}}, {{view}}, {{component}}, {{partitial}}, {{control}}

1

Hello

It’s confusing. there is a comparison table, but there are still not all relevant helpers described.

The problem is not really to understand what they are doing, thats mostly explained fragmented over the internet, but why they exist and when to use them.

{{partitial}}

Thats the easiest one. Use it to split your handlebars/html files into multiple, but nothing else. Understood.

{{render}} and {{control}}

It looks like {{control}} is the same then {{render}} when a model is specified, I we need {{control}} just when we want the same controller/view rendered without a model multiple times on the same route. Currently I’m using {{render}} very excessive, because its simple. I use it to encapsulate my staff, like {{render "itemList" items}} and inside again stuff like {{#each items}}{{render itemListElement this}}{{/each}}. I’m not sure if this is the right use for it, but if not, whats the proper use case?

{{control}} is under development, so its not fixed everything yet or documented, and thats cool. But there is still {{render}}.

{{view}}

Renders a View with the current controller. I understood, its very vell documented, but is this usefull for anything? Is there any situation when I should use {{view}} instead of {{render}}? There are the built-in ember form Views like Ember.TextField, but why are they views? It looks more then like components for me.

{{component}}

For me, it looks like a better version of {{view}}. Is this correct? The only abilitiy that it seems to have, is to encapsulate functionality on the Component. Everything else looks similar, just with changed names. So the layouts on views Looks exactly like the wrapping content in components stuff.

So, if we have now {{component}}, why should we use {{view}}, {{control}} or {{render}}? And should I migrate my {{render}} uses to {{component}}?

Soo, are there any good examples, when to use what. Especially for {{render}} {{component}} and {{view}}. Its always clear when I should not use {{view}}, but not in the other direction.

Thanks, Krutius

1 Like
2

I think this guy explains it very well when to use some of them:

3

@fanta True, and i already know this page, but this is also not complete. His isnt writing anything about {{component}}, and thats the most confusing part.

4

@krutius if you go to https://github.com/emberjs/ember.js/blob/master/CHANGELOG you’ll find this:

  • Rename Control to Component. This avoids conflicts with the existing (behind-a-flag) control and is clearer about intent.
5

@fanta Thanks u, that helps me. But then that article cant be true, because a component is not the same as the control helper?

He says, that the {{control name}} helper does mostly the same then {{render name}}. But components are used like {{my-component}} I think.

So still the confusion: When to use {{render/control}} and when to use {{my-component}}, or othen, when to write a component/template pair, and when a controller/template pair? And whats the diffrence between a component and a controller?

And when to use {{view}} and not {{my-component}}, so why do u say {{view Ember.TextField}} and not {{text-field}}?

6

Hi, this is my fisrt post, so my apologices if this message is not proper for this thread.

I´ve been using partials, since its very simple and useful when model is linked with the route. Now I am working on a web, where a structure like {{render}} really fix, since its a basic home page which just renders a couple of sections of basic information about: services, how we work, contact, last works, etc. everything with the same route (…/home) I need to use a single {{render}} in every section {{render “services” servicies}} and so on, having separated models for every section inside the route “home”, and having them linked to the proper model, and not to “home”.

I would really apreciate, if any of you could share a very basic example using a {{render}} helper, beacuse I must do something wrong and I cant make {{render}} work, following the instructions of the emberjs guide.

Thanks