Iterating over a model's attributes in EmberJS handlebars template

Question

Is there a way to iterate over a view\'s context\'s attributes in EmberJS? I am using Ember-Data (https://github.com/emberjs/data) for ORM.

Lets say I use connectOut

Answer 1

Ryan is right about the attributes, but it takes some doing to actually get where you're going. My examples here are using the latest RC1 Ember.

Here is an editor template that is model agnostic:

To make that work, we need a couple of pieces of magic-magic. This controller is a good start:

App.EditMonsterController = Em.ObjectController.extend({
    metadata: function() {
        var vals = [];
        var attributeMap = this.get('content.constructor.attributes');
        attributeMap.forEach(function(name, value) {
             vals.push(value);   
        });
        return vals;
    }.property('content')

});

That uses that "attributes" property that Ryan mentioned to provide the metadata that we are feeding into our #each up there in the template!

Now, here is a view that we can use to provide the text input. There's an outer container view that is needed to feed the valueBinding in to the actual textfield.

App.AutoTextField = Ember.ContainerView.extend({
    type: null,
    name: null,

    init: function() {
        this._super();
        this.createChildView();
    },
    createChildView: function() {
         this.set('currentView', Ember.TextField.create({
                    valueBinding: 'controller.' + this.get('name'),
                    type: this.get('type')
                }));   
    }.observes('name', 'type')
});

Here is a fiddle demonstrating the whole crazy thing: http://jsfiddle.net/Malkyne/m4bu6/