CODEWITHSUNDEEP
ember.jshandlebars.js
Gabriel G. Roy
Gabriel G. Roy

Reputation: 2632

Ember: Accessing a nested object inside an #each loop

I've got a nested object that looks like this:

{
    Level1: {
        Level2_1: 1,
        Level2_2: 2,
    }
}

My web api can return a single JSON object exactly like this one, or it can return an array of those. It turns out my model for one of the controllers is an array of these objects.

When I render the template, I do something like this:

{{#each}}
<p>{{Level1.Level2_1}}</p>
<p>{{Level1.Level2_2}}</p>
{{/each}}

When I click to navigate to another view, I get an error "Cannot read property 'level1' of undefined". It seems to happen when ember tries to destroy? the objects in the chain of elements that were referenced.

The problem is that I'm not sure how to solve this, other than not using nested objects. Any clues?

Edit: I made the property names uppercase to reflect exactly what my web api is returning. It seems like this might have been the problem, can anyone confirm?

Upvotes: 3

Views: 286

Answers (1)

Kingpin2k
Kingpin2k

Reputation: 47367

You're suspicion is correct. Uppercase properties are considered global namespace, not necessarily a property in the current context.

This is more a remnant of Handlebars pre-Ember than a standard that's taught in Ember/Handlebars.

Upvotes: 3

Related Questions