Ember Handlebars capsuled?

Questions General
1

Hej guys, I have the following problem. Here first the code:

{{#each this.example as |component|}}

    {{#if-equal param1={{component.name}} param2="componentName"}}

        {{coolcomponent}}

    {{/if-equal}}

{{/each}}

explanation: i am going throw a object array and if i find a component name that equal the param2 then i want to use a spezific component.

i am getting a error because i cant do this {{component.name}} inside the {{#if-equal}}. Is there a way to get around this ? Or a other good solution to do this ?

P.S. the #if-equal just checks if param1 is equal param2

2

change it to this and you should be set:

{{#each this.example as |component|}}
  {{#if-equal param1=component.name param2="componentName"}}
    {{coolcomponent}}
  {{/if-equal}}
{{/each}}
1 Like
3

working now… thanks. i think that was the first thing i tested and i got an error. maybe a typo.

4

i have another question for u. I am creating with this each loop dynamically components. now each component needs a different id for my usage.

Is there a option to set propertys inside handlebars ? like this ?

{{#each this.example as |component|}}
    {{component component.name (set id here)}}
{{/each}}

P.S.: i am totally new to ember so thanks for your help

5

You should just be able to pass the id in as an argument just like in any old component invocation. For example you could do this:

{{#each this.example as |component index|}}
    {{component component.name id=index}}
{{/each}}

or

{{#each this.example as |component index|}}
    {{component component.name id=(concat 'component_' index)}}
{{/each}}

or

{{#each this.example as |component|}}
    {{component component.name id=(concat "component_" component.name)}}
{{/each}}
1 Like
6

i mean i need the id inside the component .js to do some stuff. so i dont need to set the id of the div.

or is there a easy way to get the div id inside the component.js file without knocking the id ?

solved it myself: this.elementId

7

The examples above don’t set the HTML Element id. They pass an argument to the component named id. So inside the component.js, it’s available as this.id. You could change the name from id to anything else.

1 Like
8

But yes, you can control the actual HTML id with elementId.

1 Like