title: Iterating over Ember.js ember-data Record Arrays
body: <p>I've been beating my head against this problem all day, and I feel like I'm close to a solution but just can't quite make it happen.  I'm using Ember.js with Ember-Data and the Fixtures adapter, eventually migrating to a REST adapter.  The basic problem is this: I have Sites and Supervisors, with a <strong>many-to-many</strong> relationship. I want to present the user with a select box for their existing site/supervisor pairings, sorted by site, ie:</p>
  
  <ul>
  <li>Site 1 - Supervisor 1</li>
  <li>Site 1 - Supervisor 2</li>
  <li>Site 2 - Supervisor 1 <em>(remember, many to many)</em></li>
  <li>Site 2 - Supervisor 3</li>
  </ul>
  
  <p>I need to wrangle these two resources into a single array that I can pass to a view which inherits (or will inherit) from Ember.Select. Currently I'm attempting this with a method on the Supervisors controller which I'm calling "flat", because it will return a flattened array representing these relationships. The controller is shown below. I'm using .find().then() to process the data after the promise has been fulfilled. The data that I get back <em>appears</em> to contain all four of my fixtures, but when I try any of the enumerable methods on them (notably forEach), it behaves as if it has only returned the first object. I have tried iterating over the data object as well as data.get('content').  I'm quite new to Ember, so maybe I'm going about this the wrong anyway, but regardless this seems very strange to me. Here's my code:</p>
  
  <pre><code>App.SupervisorsController = Ember.ArrayController.extend({
    flat: function(){
      return App.Supervisor.find().then(function(data){
        var c = data.get('content') ;
        console.log(c) ;    // &lt;-- logs an object containing four records,
                            //     with attribute "length" showing 4
                            //     Great! (see below for log output)
  
        console.log(c[0]) ; // &lt;-- logs first record. Great!
        console.log(c[1]) ; // &lt;-- undefined (?!)
        console.log(c[2]) ; // &lt;-- undefined (?!)
        console.log(c[3]) ; // &lt;-- undefined (?!)
        console.log(c.get('length')) ; // &lt;-- 1 (not four?!)
  
        return c ; // &lt;-- eventually this will return the newly constructed array
      }) ;
    }
  }) ;
  </code></pre>
  
  <p>And here's the log output from the first console.log() call</p>
  
  <pre><code>0: Object
  1: Object
  2: Object
  3: Object
  __ember1376005434256: "ember325"
  __ember1376005434256_meta: Meta
  _super: undefined
  length: 4
  __proto__: Array[0]
  </code></pre>
  
  <p>Can you tell me what I'm missing here? I can't figure out how to access each of the four resulting supervisors.</p>
  
  <p>Thanks!</p>