Iterate array and with index of element print another array. Handleblar - Ember.js

Question

I want to iterate over an array in handlebar, and with the index of each element print one element in other json or array that i have defined.

something like this:

{{#each groups as |group index|}}
    {{#sticky-element top=41}}
       {{ad-component data=adGroup.[index].ad2 class="average-ad"}}
    {{/sticky-element}} 
{{/each}}

My component its something like this:

import Ember from 'ember';

export default Ember.Component.extend({
  adGroup: {
    '0': {"ad1": "div-gpt-ad-123-0", "ad2": "div-gpt-ad-123-4"},
    '1': {"ad1": "div-gpt-ad-123-1", "ad2": "div-gpt-ad-123-5"},
    '2': {"ad1": "div-gpt-ad-123-2", "ad2": "div-gpt-ad-123-3"}
  }
});

but pitifully it is not possible do this in handlebar.

Some people recommend me use computed properties, but how can I create a computed property for this mission?

I don't know if these last 2 days are not my lucky days or what's going on, because i think this is something simple, but I cannot with this, some help please?

what is groups, why do you loop through it? do you even need group? Because, for this you can loop through adGroup directly with each-in. — Lux
– Lux, Commented Sep 8, 2017 at 9:58

jrjohnson · Accepted Answer · 2017-09-08 06:05:48Z

1

If you structure adGroup as and array and not an object

adGroup: [
  {"ad1": "div-gpt-ad-123-0", "ad2": "div-gpt-ad-123-4"},
  {"ad1": "div-gpt-ad-123-1", "ad2": "div-gpt-ad-123-5"},
  {"ad1": "div-gpt-ad-123-2", "ad2": "div-gpt-ad-123-3"}
]

You could use ember-composable-helpers

ember install ember-composable-helpers

and get the value like

{{#each groups as |group index|}}
  {{#sticky-element top=41}}
   {{ad-component data=(get (object-at index adGroup) 'ad1') class="small-ad"}}
  {{/sticky-element}}
{{/each}}

answered Sep 8, 2017 at 6:05

jrjohnson

2,49218 silver badges25 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

BrandonW Over a year ago

If groups is adGroup, looping through the array could just be data=group.ad1 the index wouldn't be necessary.

Collectives™ on Stack Overflow

Iterate array and with index of element print another array. Handleblar - Ember.js

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related