2

有一个聊天，当有新消息进来时，它需要向下滚动。这工作正常。

但是当加载应用程序时，通过设置 ArrayController 的“内容”预加载了部分消息（大约 100 条），因此向下滚动将被调用 100 次，这是不好的。对第一大部分数据只运行一次滚动的正确方法是什么？

这是一些代码http://jsfiddle.net/agentcooper/W6Bhs/

4

2 回答 2

2

您可以创建一个scroll在内容更改时触发的函数，请参阅http://jsfiddle.net/pangratz666/zZ5Cc。因此，您基本上会将滚动行为从包含单个消息的视图拉到包含所有消息的视图。

车把：

<script type="text/x-handlebars">
  {{#view App.MessagesView class="message-list" messagesBinding="App.messages" }}
  <ul class="nav nav-list">
  {{#each messages}}
    {{#view App.MessageView contentBinding="this" tagName="li"}}
      {{unbound content.from}}: {{unbound content.message}}
    {{/view}}
  {{/each}}
  </ul>
  {{/view}}
</script>

JavaScript：

App.MessagesView = Ember.View.extend({
    didInsertElement: function() {
        this.scroll();
    },

    messagesChanged: function() {
        var that = this;
        // invoke this code in the next RunLoop, when changes are made to DOM
        Ember.run.next(function() {
            that.scroll();
        });
    }.observes('messages.@each'),

    scroll: function() {
        console.log('scroll');
        var el = this.$();
        el.scrollTop(el.prop('scrollHeight'));
    }
});
于 2012-04-06T13:19:51.177 回答
0

你的数据来自哪里？

如果您使用的是ember-data ，则可以通过标志观察ModelArray加载完成...isLoaded

您可以看到另一个答案：https ://stackoverflow.com/a/10031377/90741

于 2012-04-06T13:14:40.137 回答