Ember Data only populating the "id" property

Question

Problem: The JSON is received from the server, but only the id property have a value. The GUI only displays the String "2 1", and the {{photoName}} is ignored. Manually calling MyApp.PhotoController.get('content').objectAt(0).get('photoName') returns undefined, whereas MyApp.PhotoController.get('content').objectAt(0).get('id') returns the correct ID.

Any Sugggestions ?

//My Model:

MyApp.Photo = DS.Model.extend({
    id: DS.attr('number'),
    photoName: DS.attr('string'),
    photoDescription: DS.attr('string'),
    photoFullSizeURL: DS.attr('string'),
    photoThumbnailURL: DS.attr('string')
});

MyApp.Photo.reopenClass({
    url: 'photos.json'
});

//My StateManager

MyApp.stateManager = Ember.StateManager.create({
    rootElement: '#mainArea',
    initialState: 'showMainView',

    showMainView: Ember.ViewState.create({
        enter: function(stateManager) {
            this._super(stateManager);
            var photos = MyApp.store.findAll(MyApp.Photo);
            MyApp.PhotosController.set('content', photos);
        },

        view: Em.ContainerView.create({
            childViews: ['photoListView'],

            photoListView: Em.View.extend({
                elementId: 'photoList',
                templateName: 'photo-list-view',
                contentBinding: 'MyApp.PhotosController.content'
            })
        })
    })
})

//My Controller:

MyApp.PhotosController = Ember.ArrayProxy.create({
    content: []
});

//My template:

<script type="text/x-handlebars" data-template-name="photo-list-view">
        PHOTOS:<br/>
        {{#each content}} 
            {{photoName}} {{id}}
        {{/each}}
</script>

//JSON Received from server:

[
    {
        "id": 2,
        "photoName": "Bird Photo",
        "photoDescription": "Bird Photo Description",
        "photoFullSizeUrl": "photos/bird.jpg",
        "photoThumbnailUrl": "photos/bird_thumb.png"        
    },
    {
        "id": 1,
        "photoName": "Bird Photo 2",
        "photoDescription": "Bird Photo Description 2",
        "photoFullSizeUrl": "photos/bird.jpg",
        "photoThumbnailUrl": "photos/bird_thumb.png"
    }
]

The code is also posted as a Gist here: https://gist.github.com/2775283

Answer 1

Ah.. Got it.. Needed to add code to de-camelize my properties:

DS.Model.reopen({
    namingConvention: {
    keyToJSONKey: function(key) {
        return key;
    },

    foreignKey: function(key) {
        return key;
    }
  }
});

Found this from the following page, which I guess I should have read, anyways :D https://github.com/emberjs/data/blob/master/BREAKING_CHANGES.md