Question

使用Ember.js我使用以下代码获得无限循环：

控制器：

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<len; i++){
        for(prop in info[i]){
          things.push({"key": prop, "value" : info[i][prop]});       
        }
      }
    }

    return things;
  }.property('activity')    
})

查看：

App.ActivityDetailsView = Em.View.extend({
  templateName :        'activity-details',
  activityBinding :     'App.activityDetailsController.activity',
  dataBinding :         'App.activityDetailsController.data'

})

模板：

  <script type="text/x-handlebars" data-template-name="activity-details">
    <div id="info">
      {{#each data}}
          {{key}}: {{value}}<br />
      {{/each}}
    </div>
  </script>

尝试加载此页面时，控制器中的“数据”功能会被无休止地调用。

如果我从视图中删除了{{#each}} {{/ each}}块，则没有问题，并且在模板中使用{{data.length}}会得到正确的输出。

为什么这种循环无休止的任何想法？如果我从属性调用中删除“活动”，则问题是相同的。

谢谢，

Answer 1

制作“数据”属性cacheable()。有关原因，请参阅ebryn's answer相关问题。

在模板中使用{{#each}}标记时，Ember.js会给出无限循环

1 个答案: