Question

I have just started using Ember.js framework and I have simple problem. I have my data initialized as plain JS objects (filled in the template, created by my PHP scripts) and I’d like to transform them to Ember.js objects before the Ember.Application starts (or immediately after it starts, I don’t know the differences yet).

Is such thing possible? If yes, what’s the best approach to do it?

Example:

App.User = Em.Object.extend({
    id: null,
    avatar: "/path/to/default/avatar.jpg",
    name: null,
});
my_data = [
    {"id":1, "name":"John Doe"}, 
    {"id":2, "name":"Barrack Obama", "avatar":"/president/photo.jpg"}
];
App.usersController = Em.ArrayController.create({
    content: [],
    addUser: function(user) { ... },
});

I need something like this:

App.usersController.initialize(my_data);

Edit: There’s one more thing. My data is not exactly in the same format as Ember objects so I need to do some transformation. Just for example, imagine that I have avatar and name wrapped in another object, like this:

{
  "id":2, 
  "info": {
      "name":"Barrack Obama", 
      "avatar":"/president/photo.jpg"
  }
}

Answer 1

You could make use of the map function to “transform” your array, see http://jsfiddle.net/pangratz666/agp8C/:

App.usersController = Em.ArrayController.create({
    content: [],
    initWithDataFromServer: function(hash){
        var users = hash.map(function(item){
            return App.User.create({
                id: item.id,
                name: item.info.name,
                avatar: item.info.avatar
            });
        });
        this.pushObjects(users);
    }
});
App.usersController.initWithDataFromServer(my_data);