Question

我根据控制器中的两个数组渲染两个列表。第一个数组的内容会立即添加，但第二个数组会在延迟500毫秒后填充。顶部的列表按预期滚动，但第二个（延迟的）不滚动。延迟模拟通过Ember数据通过ajax请求加载内容，这具有相同的效果。有线索吗？

这是列表的显示方式：

<div class="content">
    <div class="content_list" data-scrollable="x">
        {{#each content1}}
            <div class="list_item">{{name}}</div>
        {{/each}}
    </div>
</div>
<div class="content">
    <div class="content_list" data-scrollable="x">
        {{#each content2}}
            <div class="list_item">{{name}}</div>
        {{/each}}
    </div>
</div>

javascript代码如下：

App.IndexController = Ember.ArrayController.extend({
   content1: [],
   content2: []
 });

App.IndexRoute = Ember.Route.extend({
    setupController: function(controller) {
        var content1 = [];
        var content2 = [];
        for (var j = 1; j < 5; j++) {
            content1.push({name: "Item " + j});
        }
        controller.set('content1', content1);


        setTimeout(function () {
            for (var i = 1; i < 5; i++) {
                content2.push({name: "Delayed item " + i});
            }
            controller.set('content2', content2);

        }, 500);
    }
});

Answer 1

将您的setTimeout更改为Ember.run.later：

Ember.run.later(function () {
      for (var i = 1; i < 5; i++) {
        content2.push({name: "Delayed item " + i});
      }
      controller.set('content2', content2);

    }, 500);

具有延迟内容的Ember列表视图（使用#each helper和zynga scroller）

1 个答案: