Ember {{component}} custom component

Question

I am new to Ember and noticed the following code in my Handlebars:

{{component sec.myCompRef secInfo=sec fields=model.myMap}}

Does Ember have some helper like {{component}}? If yes, how does it work?

I have generally seen custom helper:

{{my-helper}}

But that has the same name component hbs/js backing it?

But I am not aware of {{component}} helper.

Answer 1

Yes, Ember has {{component}} helper which allows you to dynamically choose and render component via component name passed to {{component}} helper.

So, basically the usage is:

{{component componentName}}

You can of course pass arguments and data to it like you would do with casual component declaration:

{{component componentName model=whatever}}

So, in your case:

{{component sec.myCompRef secInfo=sec fields=model.myMap}}

• sec.myCompRef is the name of component to render (it has to match some existing component)
• secInfo and fields are parameters passed to component