title: Ember.js gives infinte loop when using {{#each}} tag in template
body: <p>Using Ember.js I get an endless loop with the following code:</p>
  
  <p>Controller:</p>
  
  <pre><code>App.activityDetailsController = Em.Object.create({
    activityBinding :     'App.navController.selectedActivity',
  
    data : function(){
      var things = new Array();
      if(this.activity){
        var info = this.activity.get('info');
        var len = info.length;
        for(var i=0; i&lt;len; i++){
          for(prop in info[i]){
            things.push({"key": prop, "value" : info[i][prop]});       
          }
        }
      }
  
      return things;
    }.property('activity')    
  })
  </code></pre>
  
  <p>View:</p>
  
  <pre><code>App.ActivityDetailsView = Em.View.extend({
    templateName :        'activity-details',
    activityBinding :     'App.activityDetailsController.activity',
    dataBinding :         'App.activityDetailsController.data'
  
  })
  </code></pre>
  
  <p>Template:</p>
  
  <pre><code>  &lt;script type="text/x-handlebars" data-template-name="activity-details"&gt;
      &lt;div id="info"&gt;
        {{#each data}}
            {{key}}: {{value}}&lt;br /&gt;
        {{/each}}
      &lt;/div&gt;
    &lt;/script&gt;
  </code></pre>
  
  <p>When trying to load this page, the 'data' function in the controller is called endlessly.</p>
  
  <p>If I remove the {{#each}}{{/each}} block from the view, there is no problem and using {{data.length}} in the template gives the correct output.</p>
  
  <p>Any ideas why this loops endlessly?  If I remove 'activity' from the property call, it the problem is the same.</p>
  
  <p>Thanks,</p>