title: Is it possible to observe arrays within arrays using @each?
body: <p>I have a controller that contains an array of "things".  Within each of these things is an array of "subthings".  I'd like to create a computed property that contains all subthings in all things (a flattened array of subthings).</p>
  
  <p>My computed property depends on <code>things.@each.subthings.length</code>.  I find that if I <strong>set</strong> the <code>subthings</code> property of a thing, my computed property is updated.  However if I call <code>pushObjects</code> to add new data to my <strong>existing</strong> <code>subthings</code> array, my computed property does not update.</p>
  
  <p>I've created a <a href="http://jsfiddle.net/rharper/pDQeT/4/" rel="nofollow">jsfiddle</a> to demonstrate.  The code is as follows:</p>
  
  <pre><code>App = Em.Application.create({});
  
  App.controller = Em.Object.create({
      things: [
          Em.Object.create({subthings:[]}),
          Em.Object.create({subthings:[]}),
          Em.Object.create({subthings:[]})        
      ],
  
      allSubThings : function() {
          var things = this.get('things');
          var results = [];
          things.forEach( function(thing)  {
              results.pushObjects( thing.get('subthings') );
          });
          return results;
      }.property('things.@each.subthings.length').cacheable()        
  });
  
  
  setTimeout(function() {
      var things = App.controller.get('things');
      // This works:
      things.objectAt(0).set('subthings',[1,2,3]);
  }, 1000);
  
  setTimeout(function() {
      var things = App.controller.get('things');
      // This does not:
      things.objectAt(1).get('subthings').pushObjects([1,2,3]);
  }, 2000);
  </code></pre>
  
  <p>​
  Thanks!</p>